visual studio code前端插件的安装及前端插件应用

野性酷女 2022-02-23 02:54 514阅读 0赞

## visual studio code插件的安装及应用 ##

没有求知欲的人，就是没有翅膀的小鸟。长路漫漫，自学就会成为一种习惯。还记得刚入门的时候，对编辑器什么的简直是天方夜谭，好像懵懂的雏鸟第一次探出了头，不知世界的包罗万象。记得第一次接触的编辑器是DW,那是很久之前在学校就接触的编辑器，感觉DW就像是清末被世界遗弃的孩子，然后后面去学习中接触到了sublime,但是对这款编辑器是一点儿也不了解，后面又接触了hbuilder，这款编辑器也还可以，有很多同伴都在用，但是我总觉得visual studio code总是能给人眼前一亮的感觉，毕竟是Microsoft出的一款，可以安装各种插件，就像光秃秃的翅膀被插满了羽毛，羽翼丰满。  
其实用了很久对这些插件还是不够了解，所以借以清明放假打消一下时间，更加了解这款编辑器。

对于新手来说首先是下载这款编辑器，直接搜visual studio code官网中下载，免费的，有稳定版的，还有业内人士版（vscode insiders）的，蓝色的vscode是非常稳定的发行版本，vscode insiders版，相当于bate版本，测试版，会有一些新的vscode可能会在未来加入的功能，但是其中可能会有一些bug存在，使用的过程中需要小心一些。然后下载下来便可以了，下面是使用的过程及插件的安装。

1.修改语言，如果英语六级的话，便就可以不用修改，按住ctrl+shift+x打开拓展，安装Language Packs插件，然后按住Ctrl + Shift + P打开命令调色板，搜索Configure Display Language命令然后按Enter键，将locale.json创建一个文件，其默认值设置为您的操作系统语言。修改为zh-cn语言即可。

2.HTML Snippets：超级实用且初级的 H5代码片段以及提示；

3.HTMLHint：html代码检测;

4.HTML CSS Support :让 html 标签上写class 智能提示当前项目所支持的样式。新版已经支持scss文件检索，这个也是必备插件之一;

5.Auto Close Tag :匹配标签，关闭对应的标签。很实用【HTML/XML】;

6.Auto Rename Tag :修改 html 标签，自动帮你完成尾部闭合标签的同步修改;

7.Path Autocomplete :路径智能补全;

8.Path Intellisense ：路径智能提示;

9.JavaScript Snippet Pack：针对js的插件，包含了js的常用语法关键字，很实用；

10.View InBrowser：从浏览器中查看html文件，使用系统的当前默认浏览器;

11.Class autocomplete for HTML：编写html代码的朋友们对html代码的一大体现就是重复，如果纯用手敲不仅累还会影响项目进度，这款自动补全插件真的很棒；

12.beautify :格式化代码的工具，可以格式化JSON|JS|HTML|CSS|SCSS,比内置格式化好用;

13.jQuery Code Snippets：jquery 重度患者必须品;