VSCode 轻量、开源，新鲜下载的 VSCode 可谓是身无长物、一穷二白，连个项目处理的功用都没有。
身轻如燕的 VSCode 关于后端开发说可能有点单纯，但关于前端来说刚刚好，终究不需求搞什么 Docker、数据库等等，装俩 VSCode 插件，翻开网页，就能开工了。
这篇文章将从前端开发者的视点来介绍一些裸 VSCode 必备插件，打造一个前端友好的开发 IDE。
1. Project Manager
Project Manager 用于处理项目，有了它，可以帮你在 VSCode 中快速地在各个项目中切换，不需求痛苦地从文件目录中一级一级终究选到你想要的项目文件。
只需求在 Palette 输入 Save Project，回车保存当时项目。
然后可以在右侧菜单查看你添加的项目，点击指点项目就能切换到该项目，十分便利。
它还供给了 Tag 标签，可以细分你的项目。
2. GitLens
GitLens 从姓名就能知道它是干嘛的，VSCode 内置 Git 协助加上这个插件交互体会是优于 Webstorm 的。
它可以便利地查看代码修正信息。
可以查看某一行的改动信息
Hover 上去还能查看详细信息
GitLens 的介绍页有万字多，可见功用之完全，这里就不烦琐了。
3. Tabout
VSCode 的 Tab 键默许输出 \t，关于习气用过 WebStorm、Eclipse 的人来说十分不舒服，想要在括号处用 Tab 跳出，就可以利用到这个 TabOut。
4. Live Server
Live Server 也算是有口皆碑，它可以实时去热加载并更新代码。
实际上是起了一个 Websocket 来实现代码更新的，Live Server 在编写一些测试 HTML 页面确实好用。
5. Code Spell Checker
在拼写一些变量办法的时分，我们可以会拼错单词，Code Spell Checker 可以协助检测你的错误。
当检测出错误单词，你还可以看看它给你的一些单词建议：
6. Image Preview
当项目中引入多个图片 URL 的时分，想要预览每张图片是一张痛苦的作业，Image preview 解决了这样的作业。
7. Import Cost
在前端项目中，我们常常需求导入各类的依靠包，通过 Import Cost 可以查看导入包的大小，便于优化。
8. Parameter Hints
Parameter Hints 会展示函数的参数称谓。
9. Highlight Matching Tag
10. indent-rainbow
Indent-rainbow 把代码缩进也可以变成好看的彩虹 。
11. Blockman
Blockman 可以会高亮框出你当时所处的代码编辑块。
后记
关于 VSCode 来说，插件数量多入牛毛，关于常见开发场景来说，有许多对应的处理插件，需求用到就在 Marketplace 查找一下即可，比方 React 项目：
值得注意的是，装过多的插件并不见得是一件积德行善，VSCode 的插件机制也是工作驱动的，过多的插件带来的坏处一方面是插件功用抵触，另一方面是功能消耗，也便是让 VSCode 变得卡顿。
