汉堡之前写过一篇关于前端开发常用的几款ide编辑器,而其中vscode就是现在汉堡正在使用的一款很火的编辑器。其性能远超其他几款编辑器,另外它最特色的功能莫过于它无边无际的插件市场。下面汉堡给大家介绍几款自认为好用的插件:
![f93df956dc637a8683a8b54d04f2ed95.png](https://i-blog.csdnimg.cn/blog_migrate/5d71dcc711503c5c95e48c76bb5f0bb5.jpeg)
1、vscode-fileheader
它是一款自动添加头部注释的插件,只需要简单的配置就可以添加作者详情以及可以查看创建时间和最后修改时间,平时多人协作的时候,可以方便的查看哪个文件是谁书写的,另外最后修改的日期是什么时候。
![1ebc9841e102ac6caaa76a8b12d34fa0.png](https://i-blog.csdnimg.cn/blog_migrate/d66f9c4998cbc4bada0f8b06140c372e.jpeg)
2、HTML Snippets
比较实用且初级的H5代码片段以及提示,比较方便代码语义化的时候提高工作效率
![931f76d08a068b58bffd194e6b408c23.png](https://i-blog.csdnimg.cn/blog_migrate/9431aaf091afd4dfa3660d1f740c977d.jpeg)
3、HTML CSS Support/CSS Peek
CSS Support是css的提示,写class智能提示当前项目所支持的样式。而CSS Peek这个插件是追踪到样式表中的CSS类和ids定义的地方。
![2e039ff76c1bd0fb1f0d24640bfa0f04.png](https://i-blog.csdnimg.cn/blog_migrate/c74fd0a4401abde15737dd4c6548bf36.jpeg)
css support
![251c3254fed20a0ebb9c0035e722c927.png](https://i-blog.csdnimg.cn/blog_migrate/7396e03e2dd8fdbe3d061fc547043280.jpeg)
css peek
4、Auto Close Tag/Auto Rename Tag
Close tag是自动补全html标签,如输入将自动补全
Rename tag是自动重命名html标签,如修改为,将自动修改结尾标签为
![f1088ccac01e1094cefc6c932dc258ba.png](https://i-blog.csdnimg.cn/blog_migrate/7b13f35cc502a979f53f6078ef16c75a.jpeg)
auto close tag
![c2d7962f991b19a739ed92d2b93524ef.png](https://i-blog.csdnimg.cn/blog_migrate/73e592ffea494e38918eb77a755424c0.jpeg)
auto rename tag
5、Beautify
听名字都知道,格式化javascript,json,css,sass和HTML。
![6c692a299a82fd2c4652d2f4526e7817.png](https://i-blog.csdnimg.cn/blog_migrate/3f0e1006ef95ad10a9beba2cd037fe75.jpeg)
6、Chinese (Simplified) Language Pack
适用于vs code的中文简体语言包
![d1105d9add032371a17a5c5499579da4.png](https://i-blog.csdnimg.cn/blog_migrate/ff1cb30d0de335bf1372315cb86271e9.jpeg)
部分截图
7、tag:icon-theme
搜索标题文字的话,可以查到不同文件夹的图标类型,这个的话可以根据个人的喜好选择,没有说哪种更好,只有更适合自己的。
![43647385018614018fb4789f6877e941.png](https://i-blog.csdnimg.cn/blog_migrate/8744803594ec298d3ee6d67279be4418.jpeg)
8、ESLint
ESLint可以帮助我们检查javascript编程时的语法错误并进行提示,找到bug并确保一定程序的语法书写的正确性和规范性。
![28cc3df0b773b6634752a0311c190967.png](https://i-blog.csdnimg.cn/blog_migrate/00f5bea8f471e1b8efccfc228ab2b874.jpeg)
9、React code snippets/vue2 snippets
react和vue书写时的代码片段提示及填充。
![bc5a190c819b8d5d2e91461024121d05.png](https://i-blog.csdnimg.cn/blog_migrate/a5e7550d822695cdf6cdb2ac6f18971f.jpeg)
除了以上这些比较热门的插件,vs code还有好多好用的插件需要大家去发掘。小编就不在这里一一列出了,大家如果有一些好用的可以在下方评论推荐哦。希望大家多关注关注小编。谢谢咯!!