VSCode 常用插件

20款VS Code实用插件推荐

VS Code相关链接地址

VS Code官网地址：https://code.visualstudio.com/

VS Code插件市场地址： https://marketplace.visualstudio.com/vscode

VS Code常用插件

Chinese (Simplified) (简体中文) Language Pack for Visual Studio Code

插件描述： 此中文（简体）语言包为 VS Code 提供本地化界面。

ESLint

插件描述：

ESLint 是一个代码规范和错误检查工具，有以下几个特性：

1. 所有东西都是可以插拔的。你可以调用任意的rule api或者formatter api 去打包或者定义rule or formatter。
2. 任意的 rule 都是独立的。
3. 没有特定的coding style，你可以自己配置。

ESLint配置详解： ESLint配置详解

VS Code中好用的Git源代码管理插件 —— GitLens

插件描述： GitLens 内置到 Visual Studio 代码 Git 的能力。它可以帮助您通过 Git 责任注释和代码镜头一目了然地看到代码作者的身份，无缝地导航和浏览 Git 存储库，通过功能强大的比较命令获得有价值的见解，等等。

VS Code 源代码管理插件GitLens使用指南：
vsCode 源代码管理插件GitLens使用指南 你值得收藏

Git 历史记录查看 —— Git History

插件描述： Git 历史记录，搜索和更多内容（包括 git log）。

流程图神器 — Drawio Preview

插件描述： 在VS Code中预览绘图图文件。

Import、Require 模块路径自动补全 — Path Intellisense

插件描述： Visual Studio Code插件，自动补全文件名。在编辑器中输入对应文件的路径，会自动补全（在Import、Require导入/引入模块时非常便捷好用）。

Vue开发必备—Vetur（VS Code的Vue工具）

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

帮助Vue开发者编写更高效的Element-UI代码 - vscode-element-helper

插件描述： vscode-element-helper 是 Element-UI 的 VSCode 扩展。Element-UI 是一个很棒的库。越来越多的项目使用它。因此，为了帮助开发者更高效地编写 Element-UI, VSCode-Element-Helper 诞生了。

ES7 React/Redux/GraphQL/React-Native snippets

插件描述： 在 VS Code 中支持 React Native，React，Redux 常见代码片段的插件。

HTML CSS Support

插件描述： 在编写样式表的时候，自动补全功能大大缩减了编写时间。

Live Preview

插件描述： 实现 HTML 文件实时预览。

Live Server

插件描述： 实现Html网页代码的实时预览。

px to rem & rpx & vw (cssrem)

插件描述： 在VS Code中支持 px 和 rem 单位相互转换，并支持 WXSS。

JavaScript (ES6) code snippets

插件描述： 支持 ES6 语法描述。

VueHelper

插件描述： vscode最好的vue代码提示插件，不仅包括了vue2所有api，还含有vue-router2和vuex2的代码提示.(此插件作者已转行做影视，可以使用Vue 3 Snippets，如果不使用本插件)。

Vue 3 Snippets

插件描述： 这个插件基于最新的 Vue 2 及 Vue 3 的 API 添加了 Code Snippets。

变量命名神器 — Codelf

Easy Sass

插件描述： 自动将SASS/SCSS文件编译为.css或者.min.css。可以快速编译项目中的所有scss/sass文件。

参考： 最新最全 VSCODE 插件推荐（2023版）