怎样在VSCode安装成功后配置 ESLint 进行静态代码检查

VSCode安装ESLint插件后不会自动生效，必须确保本地已安装eslint（npm install eslint --save-dev）、配置文件（如.eslintrc.cjs）位于项目根目录并被正确加载、语言模式匹配（如TS文件需配置@typescript-eslint/parser及parserOptions.project），三者缺一不可。

VSCode 安装 ESLint 插件后，**不会自动生效**——它只负责调用你项目里的 eslint 可执行文件，而这个文件必须存在、配置必须能被正确加载、语言模式必须匹配，三者缺一不可。否则你会看到“无波浪线”“保存不修复”“TS 文件完全不检查”等静默失效现象。

确认本地 eslint 是否真正可用

插件默认只找 node_modules/.bin/eslint（Windows 是 node_modules/.bin/eslint.cmd），找不到就放弃，不报错也不 fallback。

• 在项目根目录终端运行 npx eslint --version：有输出说明已安装；报错则补装：npm install eslint --save-dev
• 若用 pnpm 或 yarn@3+，检查 node_modules/.bin/eslint 是否存在——不存在时需在 VSCode 设置中显式指定："eslint.packageManager": "pnpm"（值必须与实际包管理器一致）
• 不要依赖全局 eslint：VSCode 插件默认忽略全局安装，即使 eslint --version 能跑，项目里也可能静默失效

.eslintrc.* 文件是否被识别

VSCode 插件对配置文件格式敏感，且不向上递归查找——它只认工作区根目录下的合法配置，且当前版本（截至 2026 年中）对 eslint.config.js 支持仍不稳定。

• 优先使用 .eslintrc.cjs（CommonJS 格式），导出用 module.exports = { ... }，避免 export default 或 ESM 语法
• 确保配置中有 root: true，否则可能误读父目录配置导致规则冲突
• 打开命令面板（Ctrl+Shift+P），运行 ESLint: Show Output Channel，看日志里是否有 Using configuration from /path/to/.eslintrc.cjs ——没有就说明没加载到

TS/JSX/Vue 文件为何不校验

ESLint 默认只解析纯 JS。遇到 .ts、.tsx、.vue 等文件，若未配 parser，会直接跳过整个文件，连语法错误都不报。

• TypeScript 项目必须同时满足三者：parser: "@typescript-eslint/parser"、安装 @typescript-eslint/parser 和 @typescript-eslint/eslint-plugin、且 parserOptions.project 指向有效的 tsconfig.json 路径（如 "./tsconfig.json"）
• React JSX 文件需启用 ecmaFeatures.jsx: true，并确保 eslint.validate 包含 "javascriptreact" 或 "typescriptreact"
• Vue 单文件组件需额外设置 parserOptions.parser 子项，例如：{"parser": "vue-eslint-parser", "parserOptions": {"parser": "@typescript-eslint/parser"}}

保存时自动修复为什么没反应

eslint.autoFixOnSave 已废弃多年，现在必须走 VSCode 的统一 Code Action 机制，且仅对标记为 fixable 的规则生效（如 semi、quotes），no-console 这类规则永远无法自动删掉 console.log。

• 在项目根目录的 .vscode/settings.json 中写入："editor.codeActionsOnSave": {"source.fixAll.eslint": true}
• 必须配合 "editor.defaultFormatter": "dbaeumer.vscode-eslint"（针对 [javascript]、[typescript] 等语言标识），否则 VSCode 可能调用 Prettier 或内置格式器覆盖 ESLint 修复
• 如果同时开了 "editor.formatOnSave": true，务必关掉它，或确保 Prettier 不接管 JS/TS 文件，否则两次格式化会互相破坏

最常被忽略的是语言模式和 parserOptions.project：右下角显示 “Plain Text” 或 “JavaScript React” 却没装 eslint-plugin-react，或者 TS 规则不触发却忘了填 parserOptions.project——这两处一错，整个文件就等于没进 ESLint 流水线。