插件由Traversy Media提供,提到的插件基本都在用,而且真的蛮好用,所以推荐给大家,如果你有好用的插件可以留言评论,分享给更多的前端开发者们。
1.Live Server
唤起浏览器开启本地服务,对于
2.Live Sass Compiler
支持sass直接编译成css文件
3.HTML CSS Support
支持html编写class提示已经定义的类名
4.Auto Rename Tag
适用于 JSX、Vue、HTML,在修改标签名时,能在你修改开始(结束)标签的时候修改对应的结束(开始)标签,帮你减少 50% 的击键;
5.Prettier - Code formatter
实际上已经是代码格式化的工具标准,支持格式化几乎所有的前端代码,并且类似于 EditorConfig 支持用文件来配置格式规则;
6.JavaScript (ES6) code snippets
ES6语法中的JavaScript代码片段(支持JavaScript和TypeScript)
7.Turbo Console Log
通过自动执行编写有意义的日志消息的操作,使调试更加容易。
8.Guides 缩进参考
与内置的缩进参考线不同,Guides能够让你通过配置项来修改参考线的颜色、样式、缩进空白的背景色等,如果你愿意折腾,甚至能够配置出类似 Indent Rainbow 那样风格的参考线。下图是我使用 Solarized Dark 主题时参考线的配置:
{
"guides.normal.color.dark": "rgba(91, 91, 91, 0.6)",
"guides.normal.color.light": "rgba(220, 220, 220, 0.7)",
"guides.active.color.dark": "rgba(210, 110, 210, 0.6)",
"guides.active.color.light": "rgba(200, 100, 100, 0.7)",
"guides.active.style": "dashed",
"guides.normal.style": "dashed",
"guides.stack.style": "dashed",
}
复制代码
9.Bracket Pair Colorizer
识别代码中的各种括号,并且标记上不同的颜色,方便你扫视到匹配的括号,在括号使用非常多的情况下能环节眼部压力,编辑器快捷键固然好用,但是在临近嵌套多的情况下却有些力不从心
10.Code Spell Checker
强烈推荐,对大部分非英语母语又不想写出四不像变量名的程序员来说,正确识记拼写各种单词还是有不小的挑战,比模棱两可时需要去查在线词典不同的是,这款插件能实时的识别单词拼写是否有误,并给出提示,不少 bug 都是因为拼写错误导致的。
11.GitLens — Git supercharged
把VSCode 结合 Git的使用体验优化到了极致,能让我们在不离开编辑器,不执行任何命令的情况下知晓光标所在位置代码的修改时间、作者信息等。
12.Auto-Open Markdown Preview
打开Markdown文件时自动打开Markdown预览
13.Vetur
vue项目支持插件
14.ES7 React/Redux/GraphQL/React-Native snippets
react项目支持插件