VS Code常用插件

VS Code常用插件

1. Open-In-Browser

   说明：由于 VSCode 没有提供直接在浏览器中打开文件的内置界面，所以此插件在快捷菜单中添加了在默认浏览器查看文件选项，以及在客户端（Firefox，Chrome，IE）中打开命令面板选项。

2. Quokka

   说明：Quokka 是一个调试工具插件，能够根据你正在编写的代码提供实时反馈。它易于配置，并能够预览变量的函数和计算值结果。另外，在使用 JSX 或 TypeScript 项目中，它能够开箱即用。

3. CSS Peek

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

4. HTML Boilerplate

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

5. Prettier

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

6. Color Info

   说明：这个便捷的插件，将为你提供你在 CSS 中使用颜色的相关信息。你只需在颜色上悬停光标，就可以预览色块中色彩模型的（HEX、 RGB、HSL 和 CMYK）相关信息了

7. Auto Close Tag

   说明：自动闭合HTML/XML标签

8. Auto Rename Tag

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

9. Bracket Pair Colorizer

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

10. ESLint

    说明：js语法纠错，可以自定义配置，不过配置较为复杂，建议使用网上一些广泛使用的eslint配置，日后我也会专门针对eslint配置写一篇文章

11. HTML CSS Support

    说明：智能提示CSS类名以及id

12. HTML Snippets

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

13. JavaScript(ES6) code snippets

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

14. jQuery Code Snippets

    说明：jQuery代码智能提示

15. Path Intellisense

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

16. Vetur

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

17. vscode-faker

    说明：生成假数据，地址，电话，图片等等

    说明：