前端适合的超多Vscode 插件集合！！！

Chinese 中文汉化插件

中文翻译vscode

any-rule 正则 快捷插件

按F1输入zz往下翻就可以找到了

Vetur vue高亮插件

vue必备插件之一。提供语法高亮、片段、整理/错误检查、代码提示等功能

Path Autocomplete 自动补全路径

Open in Browser 浏览器打开html文件

快速在浏览器中打开html文件

Bracket Pair Colorizer 括号高亮

给括号加上不同的颜色，便于区分不同的区块，使用者可以定义不同括号类型和不同颜色

ESLint ESLint 插件

将ESLint集成到VS Code中

Path Intellisense 快速补全路径

文件路径名提示

javascript console utils

作用：快速console.log和删除console.log
使用：选择要打印的变量，然后使用快捷键Cmd + Shift + L会自动在下一行输出console.log（‘variable：’，variable）。使用快捷键Cmd + Shift + D会删除当前文件中的所有console.log

Element UI Snippets

使用element UI框架的可以安装一下，非常方便、

Prettier 代码格式化

Prettier 是目前 Web 开发中最受欢迎的代码格式化程序。安装了这个插件，它就能够自动应用 Prettier，并将整个 JS 和 CSS 文档快速格式化为统一的代码样式。如果你还想使用 ESLint，那么还有个 Prettier – Eslint 插件，你可不要错过咯！

**Markdown **插件

1. Markdown Preview Enhanced

​ 实时预览markdown，markdown使用者必备

2. markdownlint (推荐)

markdown语法纠错

Html Css Js 插件

1. HTML Snippets

智能提示HTML标签，以及标签含义

**2. JavaScript(ES6) code snippets **

ES6语法智能提示，以及快速输入，不仅仅支持.js，还支持.ts，.jsx，.tsx，.html，.vue，省去了配置其支持各种包含js代码文件的时间

3. css peek

能够查看CSS ID和类的字符串作为HTML文件中相应的CSS定义

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

4 . HTML Boilerplate

通过使用 HTML 模版插件，你就摆脱了为 HTML 新文件重新编写头部和正文标签的苦恼。你只需在空文件中输入 html，并按 Tab 键，即可生成干净的文档结构。

Git 插件

1. GitLens

方便查看git日志，git重度使用者必备

​ 使用教程

2. Git History git插件

​ 查看Git历史记录

文件图标插件

都差不多 看着自己的喜欢设置

1. vscode-icons

2. VSCode Great Icons

3. Material Icon Theme

vscode图标主题，支持更换不同色系的图标，值得点出的是，该插件更新极其频繁，基本和vscode更新频率保持一致

代码风格

我自己很喜欢第二个风格

1. Dracula Official

2. Dark+ Material 金黄色