1. Chinese
将vscode翻译成简体中文
![](https://i-blog.csdnimg.cn/direct/8eed271263b640c2b1bc83a54c0d8716.png)
2. ESLint
自动检查规范
![](https://i-blog.csdnimg.cn/direct/bb91966b09d74f13a40a73041c07c662.png)
3. Prettier - Code formatter
可以自动调整代码的缩进、换行和空格,确保代码风格统一。通过配置,Prettier可以在保存文件时自动格式化代码
https://juejin.cn/post/7402572475719827475
![](https://i-blog.csdnimg.cn/direct/74cf3567642d4abcaf26caf44c9d410a.png)
4. Live Server
实时预览页面
![](https://i-blog.csdnimg.cn/direct/95c06cd04bc54ff080a1e5c19aa5a2b4.png)
5. DotENV
.env 文件代码显示高亮
![](https://i-blog.csdnimg.cn/direct/627d2d3e96554b5d9e6499cfd1ad5424.png)
6. Auto Close Tag
自动闭合标签
![](https://i-blog.csdnimg.cn/direct/6ab56c7153174fcd8f63994f9d325358.png)
7. Auto Rename Tag
只要修改了开始标签,结束标签就同步跟着修改了
![](https://i-blog.csdnimg.cn/direct/b426eff1e89046d0b2bc6fab58972c25.png)
8. Vetur (vue2使用)
![](https://i-blog.csdnimg.cn/direct/a0619becfa8c4c848020a51745f871f9.png)
9. Volar(vue3使用)后改名为vue-official
Vue 官方语言工具2.0 来了,已正式更名!_vue - official-CSDN博客
![](https://i-blog.csdnimg.cn/direct/b9cba7f073114aba80ed9ed53985d7fb.png)
![](https://i-blog.csdnimg.cn/direct/4f67b40ceebe47d79f4681aac25173aa.png)
10. Vue 2 Snippets
Vue2 代码片段补全工具
![](https://i-blog.csdnimg.cn/direct/ed4ce732f5b841159a2cae5bed45123b.png)
![](https://i-blog.csdnimg.cn/direct/6932fc2447aa447783c0cfd7f4cd57cc.png)
11. Vue VSCode Snippets
代码片段模板
![](https://i-blog.csdnimg.cn/direct/d44a425b9aea41f9b32398ff8a6a996f.png)
VSCode中snippets(代码模板)的使用_vscode snippet-CSDN博客
VSCode snippets 自定义Vue3代码片段(持续更新)_vue vscode snippets-CSDN博客
12.Color Highlight
颜色高亮显示
![](https://i-blog.csdnimg.cn/direct/b28d34545cb0442abfa770d3a6836c1a.png)
13. Code Spell Checker
检测代码拼写错误
vscode代码拼写错误检测插件_code spell checker怎么使用-CSDN博客
![](https://i-blog.csdnimg.cn/direct/f88de126134248dcbb529a71a3da20cf.png)
14. Highlight Matching Tag
将选中的匹配标签高亮显示
![](https://i-blog.csdnimg.cn/direct/5f2e18e35ec04448972974fbb1e79975.png)
15. GitLens
显示最新提交记录
![](https://i-blog.csdnimg.cn/direct/4ac2f1bf88b14aa886fd2d2ff4079418.png)
![](https://i-blog.csdnimg.cn/direct/235e803b550c4c859d3523d3d1638a01.png)
16. Bookmarks
添加书签
VSCode Bookmarks 插件使用教程-CSDN博客
![](https://i-blog.csdnimg.cn/direct/449b9101624f41d98f70d8928eef6b2f.png)
![](https://i-blog.csdnimg.cn/direct/340a8e90a1094395b33f8388b2072711.png)
17. vscode-icons
显示图标
![](https://i-blog.csdnimg.cn/direct/d0fdbb06652d4b469ba7c2804e9f8c2e.png)
![](https://i-blog.csdnimg.cn/direct/a4d274c9754c484ca3ad5b6c22d8007e.png)
18. Image preview
预览图片
![](https://i-blog.csdnimg.cn/direct/fce2e705c3ef4529b6208112fb67d039.png)
![](https://i-blog.csdnimg.cn/direct/8b797bb459f444738c5f5ef261b4ac9f.png)
19. JavaScript (ES6) code snippets
为开发者提供了快速编写ES6语法的代码片段。这些代码片段包括函数、类、变量声明等常用语法结构的模板,借助这些模板,开发者可以快速插入代码段并根据需要进行自定义修改。这个插件极大地提升了编写现代JavaScript代码的效率和便捷性。
![](https://i-blog.csdnimg.cn/direct/618913c4281e447e965be2180ee42fc9.png)
20. Moonlight
颜色主题
![](https://i-blog.csdnimg.cn/direct/0aad1dc57fe64313a681f96d60d3a8bd.png)
21. open in browser
用什么浏览器打开
![](https://i-blog.csdnimg.cn/direct/23a08adfea1c4ca1be015a6f6a895552.png)
![](https://i-blog.csdnimg.cn/direct/7accb57cf889420f92c1eb2dff4fa38f.png)
22. Path Intellisense
自动补齐路径
![](https://i-blog.csdnimg.cn/direct/d07c5c9d2a33486daa760b41a3bf59e7.png)
23. Turbo Console Log
快捷生成log
![](https://i-blog.csdnimg.cn/direct/aefd0c06959f428a81df84e3d27130ef.png)
如果默认快捷键重复了,在此处修改快捷命令
![](https://i-blog.csdnimg.cn/direct/f2f3851eba09422197da5be6ec83f5ba.png)
24. ChatGPT
![](https://i-blog.csdnimg.cn/direct/41a61cca448f4e63b3de8769ef987ab1.png)
25. GitHub Copilot
![](https://i-blog.csdnimg.cn/direct/c10314b4e8e746fd9ab14b0a22df464f.png)