VsCode做前端，你需要的那些插件！

之前很多文章都提过，自从使用nest.js之后，我越来越喜欢在vscode上写东西了，总的来说，这款软件并没有像webstorm那么大而全，那么我更多使用这款软件的原因是什么呢？

首先是随着ts越来越流行，对ts支持做的非常好的vscode已经拥有近乎和IDEA系列开发环境相同的代码提示等功能，可以说是非常方便了；接着对于我个人而言，前端还是最主要的部分，即使是后端开发，也只是并不太复杂的API设计，而且我个人是使用node.js或者python比较多的，不需要Java的话，IDEA确实没有这个必要；最后就是颜值了，看着vscode的主题库，我是真不想再写webstorm。

既然并不是大而全的集成开发环境，插件之类的自然要自己甄选，我在这里就介绍自己装的并且推荐的一些插件，一些简单的插件这里不会介绍太多。

目录

Auto Rename Tag

Bracket Pair Colorizer

Indent-Rainbow

 GitLens

Markdown Preview Enhanced

gitignore

Prettier - Code formatter

Quokka.js

Vetur

ES7 React/Redux/React-Native/JS snippets

Angular Snippets (Version 8)

Horizon Theme

REST Client

其他

---

Auto Rename Tag

修改http dom节点名字的时候，这款插件可以让你非常方便的修改，也就是改前面的，后面的他会同步修改的。

Bracket Pair Colorizer

很简单的插件，可以更改不同级别括号的颜色，效果自己找：

Indent-Rainbow

上面空格的彩虹特性看到了没！

对于python或者ruby之类的可能更有用吧，但是也是挺好的插件了。

 GitLens

看到上面有一行后面淡色的小字了没！

听这个插件的名字就很清楚，这是和github配合着用的神器，它可以让你看到每行代码最后修改的时间和修改者，commit的信息等，对于团队协作也是很重要的。当然功能布置这些，这里不在详细介绍。

Markdown Preview Enhanced

预览markdown文件的插件，和内置的相比看起来更舒服些。

gitignore

我用的是这个，还挺方便的

 

Prettier - Code formatter

用过这个插件，从此eslint说拜拜！开玩笑，但是这个确实挺好用的，安装之后按照自己的喜好改一下设置，个人喜欢搜"on save"，然后开启让代码保存时自动format。

Quokka.js

这个贴个图感受一下就知道了。。。

这里是集成的命令，看注释就知道功能有多丰富了，但是上手起来还是有点麻烦的，推荐一下，成本高还是收获高，看大家自己的感觉了。

 

Vetur

这个做Vue的都知道，没这插件没人在vscode里面写vue吧，但是和wenstorm差距还是有的。

ES7 React/Redux/React-Native/JS snippets

这个是写react的神器，尤其是snippets。

 

Angular Snippets (Version 8)

这个我个人没用过，没怎么写过ng，是看别人推荐的最多，试了下还不错，见仁见智吧。

 

Horizon Theme

这个主题我个人是真的喜欢，粉嫩粉嫩的。。

REST Client

可以替代postman的工具，怎么说呢，自从有了nest.js，我更喜欢swagger。

其他

还有很多很好用工具，我觉得大家可能都知道，比如docker和k8s的扩展，Debugger for Chrome， 还有官方的remote系列都是很好的插件。