VS Code 折腾记 - (14) 再来推荐一波大前端适用系列 (Node/React/Vue/小程序/主题/代码体验等) 的插件

26,257 阅读4分钟

前言

时隔半年,这期间我又搜罗了一波感觉比较好的插件,

依旧是那句话,好的插件需要作者去创造,时间去迭代...

废话不多说,直入主题;

插件集

React

Vue

Typescript

  • Comments in Typescript: 针对TS的注释插件,基于JSDoc定制
  • Class IO : 可以显示引用类相关的关系(在代码编辑区域显示一个对应的标志位)
  • ClassLens : 快速跳转到类的相关引用
  • TSLens: tslens的gutter,可以让你更直观的看到不同类型的引用,支持五种类型

GraphQL

Node

微信小程序

  • mpvue snippets: mpvue的一些代码片段,以及部分原生小程序的代码提示
  • minapp : 用VS Code写小程序必备的插件,里面有众多实用的特性集成

代码测试

代码可视化改善

  • Polacode : 生成精美的代码截图,很漂亮,根据你当前主题配色生成的
  • vscode-pigments: 代码页面展示颜色代码并展示对应的颜色,非常实用
  • Json Editor : 非常实用的可视化JSON编辑,不容错过
  • Subtle Match Brackets:快速高亮你配置的闭合,对于聚焦我们的光标区块代码很有帮助
  • vscode-live-server : 非常全面的HTML预览工具,支持众多实际开发需要的特性,比如https,代理,cros
  • Filter Line : 对于处理日志文件,可以快速筛选出我们需要聚焦的内容
  • Better Comments: 最好用的注释区域高亮,对于TODO这些支持也很好
  • :emojisense: : 可配置化(针对语言),智能提示emoji,非常实用..走过路过不要错过
  • Markdown Header Coloring : 给Markdown的标题区域添加一个亮瞎眼的颜色...
  • BreadCrumb in StatusBar : 面包屑的支持,在底部状态栏展示

主题

主题这块,萝卜青菜各有所爱,这些都是我用过感觉都不错的

改善编码体验

  • Vim : 王牌插件,让vscode支持vim的常用特性,还集成几种常用vim插件的特性,喜欢的不容错过
  • Class Helper : 对class快速编辑,支持ts,js,php
  • Bash IDE: 对bash提供类似IDE的体验,跳转,智能提示这些
  • JSON Helper : 提供大纲功能,可以快速跳转编辑
  • Shortcut Menu Bar: 把几个很常用的行为做成图标内置在编辑区域内,对于非快捷键熟练的小伙伴有所用处
  • YAML Support by Red Hat Preview : 涵盖了对YAML的校验,智能提示,对于用这个写配置文件的很有用处
  • indent-rainbow: 会给缩进添加一种颜色,让你更加直观的看到代码层次
  • Web Search: 选择代码内容,快速跳转到搜索引擎,支持Google, DuckDuckGo, StackOverflow三种引擎,打开的是默认本地浏览器
  • vscode-pdfviewer: 让VS Code可以阅读PDF文档,支持目录这些
  • Projects+: 项目管理必备插件,可以快速录入本地项目的地址,打开..非常实用

总结

VS Code目前依旧保持每个月迭代一个版本,每个版本都能看到改善的地方;

这里也不比较其他编辑器乃至IDE了,好不好用,用了就知道。

有不对之处请留言,会及时更正...