VS Code（Visual Studio Code）是由微软研发的一款免费、开源的跨平台文本（代码）编辑器。前端开发几乎完美的编辑器。

推荐我所使用的插件

打开：
open in browser
浏览器打开文件，快捷键：alt+b 或右键打开
自动刷新–>Live Server
右键打开或终端打开，local host：5500选择文件，自动刷新。
样式类：
Bracket Pair Colorizer
括号高亮显示
change-case
清洁代码，普通文本一键转换包括驼峰命名、下划线分隔命名，snake_case 命名以及 CONST_CAS 命名等。
Color Info
css样式颜色提示，可以自动选择颜色。鼠标停留就可以预览色块中色彩模型的（HEX、 RGB、HSL 和 CMYK）相关信息了。
GlassIt-VSC
使vscode软件整体变透明的插件，包括背景，字体，透明度可以调节。ctrl+alt+z透明，ctrl+alt+c恢复正常。我自己特别喜欢，把vscode放在浏览器上面，配合自动保存，和自动刷新，只要一改代码，就立马能看见效果。
主题：
代码提示：
intelliSense for CSS class names in HTML
把项目中link引用的 css 文件内里的名称智能提示在 html 中。
jQuery Code Snippets
jQuery代码提示。例如：jqajax–>自动生成ajax样式
JavaScript (ES6) snippets
JavaScript (ES6) 代码提示。
SQL Server (mssql)
sql语句代码提示。
ExpressJs 4 Snippets
用于VS Code的ExpressJs 4代码段。
Vetur
vue 代码提示。
Vue 2 Snippets
Vue 2 代码段。
Bootstrap 4, Font awesome 4, Font Awesome 5 Free & Pro snippets
Bootstrap 4代码提示片段。
工具类：
自动保存
vscode 自带功能，选项栏： 文件–>选择自动保存
vscode-pdf
vscode中打开pdf格式文档。
Image Preview
鼠标移到路径里显示图像预览。
Easy LESS
less格式语法自动转换相对应css文件，方便引用。
htmltagwrap
在选中HTML标签中外面套一层别的标签 “Alt + W” 。
Auto Rename Tag
自动重命名标签，关联使用，更改开始标签，结束标签同时更改。
Path Intellisense
路径补全。
功能类：
Chinese (Simplified) Language Pack for Visual Studio Code
简体中文版。

Prettier - Code formatter
代码格式化软件，支持：html，css，js，json，php，nodejs、等，强烈推荐！
使用方式：
· CMD + Shift + P -> Format Document
· 重新绑定editor.action.formatDocument，在editor.action.formatSelection在vscode的键盘快捷键菜单。

CSS Peek
追踪至样式表中 CSS 类和 ids 定义的地方。当你在 HTML 文件中右键单击选择器时，选择“ Go to Definition 和 Peek definition ”选项，它便会给你发送样式设置的 CSS 代码。

vue-peek
同css peek，追踪 vue定义的地方。

ESLint
在团队协作中，为避免低级 Bug、产出风格统一的代码，公司会预先制定编码规范。EsLint帮助我们检查Javascript编程时的语法错误。比如：在Javascript应用中，你很难找到你漏泄的变量或者方法。EsLint能够帮助我们分析JS代码，找到bug并确保一定程度的JS语法书写的正确性。
具体安装教程，借鉴：
https://blog.csdn.net/walid1992/ ... tm_source=blogxgwz0

VS Code（Visual Studio Code）是由微软研发的一款免费、开源的跨平台文本（代码）编辑器。前端开发几乎完美的编辑器。

推荐我所使用的插件

打开：
open in browser
浏览器打开文件，快捷键：alt+b 或右键打开
自动刷新–>Live Server
右键打开或终端打开，local host：5500选择文件，自动刷新。
样式类：
Bracket Pair Colorizer
括号高亮显示
change-case
清洁代码，普通文本一键转换包括驼峰命名、下划线分隔命名，snake_case 命名以及 CONST_CAS 命名等。
Color Info
css样式颜色提示，可以自动选择颜色。鼠标停留就可以预览色块中色彩模型的（HEX、 RGB、HSL 和 CMYK）相关信息了。
GlassIt-VSC
使vscode软件整体变透明的插件，包括背景，字体，透明度可以调节。ctrl+alt+z透明，ctrl+alt+c恢复正常。我自己特别喜欢，把vscode放在浏览器上面，配合自动保存，和自动刷新，只要一改代码，就立马能看见效果。
主题：
代码提示：
intelliSense for CSS class names in HTML
把项目中link引用的 css 文件内里的名称智能提示在 html 中。
jQuery Code Snippets
jQuery代码提示。例如：jqajax–>自动生成ajax样式
JavaScript (ES6) snippets
JavaScript (ES6) 代码提示。
SQL Server (mssql)
sql语句代码提示。
ExpressJs 4 Snippets
用于VS Code的ExpressJs 4代码段。
Vetur
vue 代码提示。
Vue 2 Snippets
Vue 2 代码段。
Bootstrap 4, Font awesome 4, Font Awesome 5 Free & Pro snippets
Bootstrap 4代码提示片段。
工具类：
自动保存
vscode 自带功能，选项栏： 文件–>选择自动保存
vscode-pdf
vscode中打开pdf格式文档。
Image Preview
鼠标移到路径里显示图像预览。
Easy LESS
less格式语法自动转换相对应css文件，方便引用。
htmltagwrap
在选中HTML标签中外面套一层别的标签 “Alt + W” 。
Auto Rename Tag
自动重命名标签，关联使用，更改开始标签，结束标签同时更改。
Path Intellisense
路径补全。
功能类：
Chinese (Simplified) Language Pack for Visual Studio Code
简体中文版。

Prettier - Code formatter
代码格式化软件，支持：html，css，js，json，php，nodejs、等，强烈推荐！
使用方式：
· CMD + Shift + P -> Format Document
· 重新绑定editor.action.formatDocument，在editor.action.formatSelection在vscode的键盘快捷键菜单。

CSS Peek
追踪至样式表中 CSS 类和 ids 定义的地方。当你在 HTML 文件中右键单击选择器时，选择“ Go to Definition 和 Peek definition ”选项，它便会给你发送样式设置的 CSS 代码。

vue-peek
同css peek，追踪 vue定义的地方。

ESLint
在团队协作中，为避免低级 Bug、产出风格统一的代码，公司会预先制定编码规范。EsLint帮助我们检查Javascript编程时的语法错误。比如：在Javascript应用中，你很难找到你漏泄的变量或者方法。EsLint能够帮助我们分析JS代码，找到bug并确保一定程度的JS语法书写的正确性。
具体安装教程，借鉴：
https://blog.csdn.net/walid1992/ ... tm_source=blogxgwz0