趁着空了的时间，把常用的一些vscode插件整理一下，方便后面更换电脑又得重新去搜索下载 ，需要的同学可以先收藏一下，后续有get到一些新的插件会继续更新！【推荐学习：《vscode教程》】
1. Indent-Rainbow
让缩进带有颜色
2. Material Icon Theme
好看的文件图标
3. Beautify
代码格式化
4. Power Mode
一款酷炫的键盘敲击动效
5. Vetur
强大的vue开发支持工具
6. vscode-fileheader
文件头部注释信息
7. Vue CSS Peek
为单页面的 vue 文件提供 css 转定义的支持
8. Vue Peek
点击组件可以跳转至组件定义的文件
9. Vue VSCode Snippets
Vue中的一些data、method等函数自动补全提示，方便快速编写代码；
10. 小霸王
一款在vscode里可以玩的超级玛丽
11. A-super-translate
划词翻译。鼠标停留选中几秒就会查看翻译内容。
12. filesize
在状态栏中显示当前文件大小。
13. TabNine
Al辅助代码补全神器。可以根据你写过的代码习惯，来给你匹配合适的字段。
14. Auto Close Tag
自动闭合标签
15. Auto Import
自动导入模块
16. Auto Rename Tag
更改标签名时结束标签名自动重命名
17. Quokka
是一个调试工具插件，能够根据你正在编写的代码提供实时反馈。它易于配置，并能够预览变量的函数和计算值结果。另外，在使用 JSX 或 TypeScript 项目中，它能够开箱即用。
18. CSS Peek
使用此插件，你可以追踪至样式表中 CSS 类和 ids 定义的地方。当你在 HTML 文件中右键单击选择器时，选择“ Go to Definition 和 Peek definition ”选项，它便会给你发送样式设置的 CSS 代码。
19. HTML Boilerplate
通过使用 HTML 模版插件，你就摆脱了为 HTML 新文件重新编写头部和正文标签的苦恼。你只需在空文件中输入 html，并按 Tab 键，即可生成干净的文档结构。
20. Better Comments
通过添加彩色注释来改进您的代码并使其更具吸引力。
21. Error Lens
将编辑器诊断出的警告、错误、语法问题（提示的波浪线）等，以用颜色填充行背景的方式突出提示，并将诊断信息显示在尾部。
22. Prettier
是目前 Web 开发中最受欢迎的代码格式化程序。安装了这个插件，它就能够自动应用 Prettier，并将整个 JS 和 CSS 文档快速格式化为统一的代码样式。如果你还想使用 ESLint，那么还有个Prettier – Eslint 插件，你可不要错过咯！
23. color highlight
一款比较常用的代码高亮插件
24. Color Picker
颜色选择器
25. Git Blame
能够查出那段代码是谁写的
26. ESLint
eslint插件
27. TODO Highlight
TODO高亮显示
28. Trailing Spaces
突出显示尾随空格，让你的“空格”型强迫症 显示呈现
29. VS Code Counter
统计代码总行数、注释行数、空白行数，以及使用的语言。
30. Bracket Pair Colorizer
给匹配的括号着色
31. Code Spell Checker
拼写检查器。比如 banana 单词写错成 banane ，会提示你是否修改成 banana ，也可以将 banane 添加至检查器的字典中。
32. Path Intellisense
自动完成文件名
33. Rainbow Fart
官方概述：VSCode Rainbow Fart是一个在你编程时持续夸你写的牛逼的扩展，可以根据代码关键字播放贴近代码意义的真人语音。
34. any-rule
可以在vscode里快捷使用正则表达式，不需要借助度娘了！
35. ## Todo Tree
Todo Tree 是一个提示待办事件的插件，在代码注释最前面加上//TODO，整个注释就会高亮显示；
36. ## project-tree
这是一个自动生成项目结构的插件；
更多编程相关知识，请访问：编程入门！！
以上就是vscode中常用的36个前端插件，直接搜索下载！的详细内容，更多请关注自由互联其它相关文章！