vscode前端常用插件

vscode 基本插件

Auto Close Tag

自动闭合HTML/XML标签

Auto Rename Tag

自动完成另一侧标签的同步修改

Beautify

格式化代码，值得注意的是，beautify插件支持自定义格式化代码规则

Bracket Pair Colorizer

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

Debugger for Chrome

映射vscode上的断点到chrome上，方便调试

HTML CSS Support

智能提示CSS类名以及id

HTML Snippets

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

JavaScript(ES6) code snippets

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

jQuery Code Snippets

jQuery代码智能提示

open in browser

vscode不像IDE一样能够直接在浏览器中打开html，而该插件支持快捷键与鼠标右键快速在浏览器中打开html文件，支持自定义打开指定的浏览器，包括：Firefox，Chrome，Opera，IE以及Safari

Chinese（Simplified）language

语言插件，vscode默认语言英语，需要安装其他语言插件

Path Intellisense

自动提示文件路径，支持各种快速引入文件

Vetur

Vue多功能集成插件，包括：语法高亮，智能提示，emmet，错误提示，格式化，自动补全，debugger。vscode官方钦定Vue插件，Vue开发者必备。

React/Redux/react-router Snippets

React/Redux/react-router语法智能提示

vscode-icon

让 vscode 资源树目录加

HTMLHint

html代码检测

Project Manager

在多个项目之前快速切换的工具

filesize

在底部状态栏显示当前文件大小，点击后还可以看到详细创建、修改时间

CSS Peek

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

Prettier

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

Icon Fonts

这是一个能够在项目中添加图标字体的插件。该插件支持超过 20 个热门的图标集，包括了 Font Awesome、Ionicons、Glyphicons 和 Material Design Icons

bootstrap 4 snippets

bootstrap 类提示插件