VS Code 必备插件推荐：提升前端开发效率
VS Code 是前端开发者的首选编辑器。本文精选了最实用的 VS Code 插件，涵盖代码补全、格式化、调试、Git 集成等核心功能。
为什么需要 VS Code 插件
VS Code 本身是个轻量编辑器，真正让它变成 IDE 的，是插件。插件装对了，一天能省不少时间；装错了，卡得像蜗牛。
下面这些是我实际用过、留下来的，不是插件市场排行榜上刷出来的。
代码质量类
ESLint
装这个不用解释。关键是配置要对，不然比没有还烦。
我遇到最多的问题是：ESLint 插件装了，但项目根目录的 .eslintrc 没配置好，结果编辑器疯狂报红，点开全是格式问题。
**建议**：团队项目一定要统一 .eslintrc 和 .prettierrc，不然每个人的格式化结果不一样，PR 里全是格式改动，没人看得下去。
// settings.json 加入这段，保存时自动 fix
{
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
}
}
Error Lens
这个插件干一件事：把错误和警告直接显示在代码行末尾。
原来要悬停才能看到错误信息，现在直接显示在行尾，省去很多点击。我们团队每个人装了 VS Code 我都会推荐这个，反馈一致：用了就回不去了。
唯一要注意的是错误太多时会比较吵，建议配合 ESLint 的 rules 把真正有用的规则留下，没用的关掉。
Git 类
GitLens
展示每一行代码是谁写的、什么时候改的，在多人协作的项目里特别有用——看到一段看不懂的代码，先看 Blame，大概率是那个人的风格，心里有数再去问。
有个小技巧：GitLens 的 Status Bar 可以显示当前行的作者信息，但如果你觉得状态栏太吵，可以在设置里关掉：
{
"gitlens.statusBar.enabled": false
}
Git Graph
图形化看提交历史，类似 SourceTree 但不用切换窗口。merge 冲突的时候用这个看 diff 比命令行直观得多。
前端框架类
Volar（Vue 3 项目必装）
如果你在用 Vue 3，Vetur 必须禁用，不然两个插件抢着解析 .vue 文件，类型推导全乱。
Volar 的类型检查是基于 TypeScript 的，所以 .vue 文件里的