VS Code 折腾记 - (16) 推荐一波实用的插件集

11,240 阅读3分钟

前言

VS Code越来越完善了,这半年期间我又搜罗了一波个人认为比较实用的插件。

插件集

前端领域

  • Dependency Analytics :分析项目中npm模块依赖,给出了很直观的数据反馈(包是否有安全问题等)
  • Gitmoji Commit :预设emoji的模板输入,快速commit
  • Xml Complete :XML智能补全,遵循类似协议的也可以
  • BEM Helper :css BEM方式创建类名(辅助工具)
  • JavaScript Code Snippet :装了这个,可以不装另外通用 js snippet 了,支持语言很全面
  • Umi Pro :提供 umi js 框架的智能提示,包括补全,跳转,引用查看
  • React Hooks Snippets :React 内置 Hooks 几个 snippet
  • perfect-css-modules : css module 的体验加成,悬浮提示,智能提示,引用跳转
  • CSS Navigation :获取CSS的定义(跳转或者悬浮),支持 HTML/JSX/TSX ,及类名这些的智能提示,非常棒
  • VSCode React Refactor :可以很方便对React组件代码进行重构
  • fabulous :可视化编辑 css, scss, js, jsx ,tsx 文件的样式,很方便!
  • Angular Inject Service :服务注入智能提示补全
  • Browser Preview :真正强大的网页预览(走内置非外部浏览器),支持断点调试
  • Copilot for VS Code :非常直观的展示梳理状态容器数据树,前端小伙伴必装
  • ReactION :实时预览react组件
  • Highlight Matching Tag :标签匹配高亮,支持 jsx,html 及主流的 vue,ng
  • changelog :悬浮可以查看安装包在github发布changelog的相关信息
  • Better package.json : 可以直观看到当前安装版本和期望看到的版本隔了多少版本
  • Color Manager :一个很酷炫的颜色管理插件,很强大
  • Intelli Refactor : 提供类似 JetBrain 的快速代码重构功能
  • NestJs Snippets :  NG 即视感的 NodeJS 框架,常用的都说好!!

编辑

  • Dotfiles Syntax HighlightingPreview :常见隐藏文件语法高亮,挺实用的。
  • File Brace Expansion :可以根据后缀名快速创建多个文件,很实用
  • auto-header :一个小巧可配置的文件头部注入,用着感觉挺好
  • License Header Manager :快速生成自定义格式的协议内容,特别适合用于开源项目的
  • Syntax Highlighter :加强语法高亮,用过才知道!
  • Code Time :记录你的编程时间,摸鱼!!!
  • Task Explorer :全局任务管理器,支持多种任务脚本的识别
  • TabNine :基于深度学习训练模型打造的智能提示,很实用,准确率挺高
  • Pomodoro : 没有花里胡哨,最实用的番茄倒计时,在编辑内配合 zen 模式,完美

Git

  • Git Graph :图形化 git log ,还支持代码对比这些
  • Git File History :动态的查看文件git的历史记录,比如代码区域的变动!很炫!

正则


主题

  • Dainty :很不错的一款主题,提供亮色和暗色调
  • 2077 Theme :对比度比较高的暗调主题,用着感觉挺好
  • Universe :一款比较柔和的暗色调主题,很喜欢。
  • Umi :很柔和的一款主题
  • Min Theme :很不错的双色调主题风格
  • Snazzy Plus :很不错的一款暗色调主题,内置几个风格
  • Hypersubatomic :高对比的主题风格,很漂亮
  • VSCode Great Icons : 一款很精美的文件图标主题