首先安装 ESLint 插件并初始化配置文件，再启用保存时自动修复。具体为：在 VSCode 扩展市场安装官方 ESLint 插件；在项目根目录运行 npm init @eslint/config 生成 .eslintrc.cjs 或 .eslintrc.json 配置文件；设置 VSCode 的 "Editor: Format On Save" 并添加 "editor.codeActionsOnSave": { "source.fixAll.eslint": true } 实现保存时自动修复；确保项目本地安装 eslint 及相关解析器如 @typescript-eslint/parser，且 VSCode 打开的是项目根目录。配置成功后，ESLint 将实时标出代码问题并支持快速修复，提升代码规范与团队协作效率。
要在 VSCode 中配置 ESLint 代码检查，核心是安装插件并正确设置项目中的 ESLint 规则文件。只要 ESLint 能识别你的代码风格规范，VSCode 就能实时标出问题并支持自动修复。
安装 ESLint 插件
打开 VSCode，进入扩展市场搜索 ESLint，选择由 Microsoft 提供的官方插件并安装。这个插件会连接你项目里的 ESLint 配置，实现语法检查和错误提示。
初始化 ESLint 配置文件
在项目根目录中配置 ESLint 规则，通常通过以下步骤生成配置文件：
- 确保已安装 Node.js 和 npm
- 运行命令 npm init @eslint/config（或全局安装 eslint 后执行 eslint --init）
- 根据提示选择模块类型、框架（如 React 或 Vue）、是否使用 TypeScript 等
- 选择代码风格标准，比如 Airbnb、Standard 或自定义规则
完成后会生成 .eslintrc.cjs 或 .eslintrc.json 文件，里面包含具体的校验规则。
启用自动修复和保存时检查
为了让 VSCode 在保存文件时自动修复可修复的问题，需要调整编辑器设置：
- 打开 VSCode 设置（Ctrl + ,）
- 搜索 format on save，勾选 "Editor: Format On Save"
- 添加设置项："editor.codeActionsOnSave": { "source.fixAll.eslint": true }
这样每次保存代码时，ESLint 会自动修复缩进、引号等格式问题。
处理常见问题
如果 ESLint 没有生效，可以检查以下几个方面：
- 确认项目根目录有 .eslintrc.* 配置文件
- 确保项目已安装 eslint 包（本地安装优先）
- 若使用 TypeScript，需安装 @typescript-eslint/parser 和相关插件
- 检查 VSCode 当前打开的是项目根目录，而非上级文件夹
基本上就这些。配置完成后，ESLint 会在编辑器中用波浪线标出不符合规则的代码，同时支持快速修复建议。保持规则一致有助于团队协作和代码质量提升。
