VSCode 配合 ESLint 可自动检查并修复 JavaScript 代码风格问题，需正确安装扩展、初始化本地配置、启用自动修复，并按项目定制规则避免全局污染。
VSCode 配合 ESLint 能自动检查并提示 JavaScript 代码中的风格与潜在问题，关键在于正确安装、配置和启用规则，而不是装完就完事。
安装 ESLint 扩展和本地依赖
先在 VSCode 商店搜索并安装官方 ESLint 扩展（作者是 Dirk Baeumer）。接着在项目根目录运行：
- npm init -y（如无 package.json）
- npm install eslint --save-dev
- npx eslint --init，按提示选择风格（如 Airbnb、Standard 或自定义）
这会生成 .eslintrc.js（或 .json/.yml），里面就是你的规则源头。
确保 VSCode 识别并启用 ESLint
默认情况下，VSCode 的 ESLint 扩展只对打开的 JS/JSX 文件生效。确认以下几点：
立即学习“Java免费学习笔记（深入）”；
- 文件右下角显示 JavaScript（不是 TypeScript 或 Plain Text）
- 在 VSCode 设置中搜索 eslint.enable，确保为 true
- 如果项目用 TypeScript，需额外安装 @typescript-eslint/parser 和插件，并在 .eslintrc 中配置 parser 和 plugins
让 ESLint 自动修复可修复的问题
很多风格问题（如分号、引号、空格）ESLint 可以一键修复。方法有两种：
- 保存时自动修复：在 VSCode 设置中开启 eslint.autoFixOnSave（注意该选项在新版中已改为 editor.codeActionsOnSave → source.fixAll.eslint）
- 手动触发：右键 → Quick Fix（或 Ctrl+Shift+P → ESLint: Fix all auto-fixable Problems）
注意：只有标记为 ✅ fixable 的规则才会被修复，逻辑错误类规则（如未定义变量）只能报错，不能修。
按项目定制规则，避免全局污染
不要在用户设置里全局配置 ESLint 规则。每个项目应有自己的 .eslintrc.js 和 .eslintignore：
- .eslintignore 写上 node_modules/**、dist/**、build/** 等无需检查的目录
- 若团队协作，把配置文件提交到 Git，保证所有人使用同一套规则
- 想临时禁用某行检查？加注释：// eslint-disable-next-line no-console
基本上就这些。配好一次，后续写代码时错误实时浮现，格式自动对齐，省下的调试时间远超配置花的十分钟。
