VSCode 不自带 ESLint，需手动安装官方扩展并配置本地依赖与规则文件；未正确安装 eslint 或插件、packageManager 设置错误、文件未匹配 glob 等均会导致检查失效。
VSCode 本身不自带 ESLint，必须手动安装扩展并配置项目级规则，否则打开文件时不会触发任何检查。
安装 ESLint 扩展和本地依赖
VSCode 的 ESLint 功能由ESLint 官方扩展提供，但它只负责调用项目中已安装的 eslint 包，不内置引擎。
如果你只装了扩展但没在项目里装 eslint，编辑器会报错：
Failed to load plugin 'xxx' declared in '.eslintrc.js': Cannot find module 'eslint-plugin-xxx'- 在项目根目录运行：
npm init -y && npm install eslint --save-dev
- 推荐同时安装常用插件（按需）：
eslint-plugin-react、@typescript-eslint/eslint-plugin - VSCode 中搜索安装扩展：
ESLint（作者：Microsoft） - 确保扩展设置中启用了“Auto Fix on Save”（如需保存时自动修复）
配置 .eslintrc.* 文件
ESLint 默认查找.eslintrc.js、.eslintrc.cjs、.eslintrc.json 等，优先级从高到低。推荐用 .eslintrc.cjs（兼容 ES 模块与 CommonJS，尤其在 Node ≥14 + TypeScript 项目中更稳）。
- 不要直接复制网上零散规则拼凑，先用官方初始化：
npx eslint --init
- 回答几个问题后，它会生成基础配置（比如是否用 TypeScript、React、Prettier 等）
- 常见关键字段：
-
env：指定环境（browser: true、node: true） -
extends：继承预设（eslint:recommended、plugin:react/recommended） -
plugins：声明插件（["react"]），否则extends中的plugin:xxx会报错 -
rules：覆盖具体规则（"no-console": "warn"）
-
VSCode 设置与常见失效原因
即使配置正确，也常因以下原因导致“没反应”：-
eslint.packageManager设置错误：如果用pnpm或yarn，需在 VSCode 设置中显式指定，否则找不到本地eslint - 工作区未启用 ESLint：检查右下角状态栏是否有
ESLint图标；没有则点击它 → “Enable ESLint for this workspace” - 文件未被
glob匹配：默认只检查*/.{js,jsx,ts,tsx}，若你写的是.vue或.svelte，需在eslint.validate中补充 - 使用了
overrides但路径匹配失败：比如files: ["src/*/"]写成files: ["src/**"]，后者不匹配文件
{
"eslint.validate": ["javascript", "javascriptreact", "typescript", "typescriptreact"]
}与 Prettier 冲突怎么处理？
Prettier 负责格式化，ESLint 负责逻辑/风格检查，二者定位不同，但规则重叠（如引号、分号）会导致冲突。- 不要用
eslint-config-prettier关闭所有 ESLint 格式规则（太粗暴），而是配合prettier插件做协同：- 安装：
npm install --save-dev prettier eslint-config-prettier eslint-plugin-prettier - 在
.eslintrc.cjs的extends末尾加："plugin:prettier/recommended" - 确保
plugin:prettier/recommended放在extends最后——它会把其他规则中和 Prettier 冲突的部分设为"off"
- 安装：
真正容易被忽略的是：VSCode 的 ESLint 扩展默认只在打开的文件中生效，对未打开的文件（比如刚 git pull 下来的）不会主动扫描。需要手动右键文件 → “ESLint: Fix all auto-fixable Problems”，或配置 eslint.run 为 onSave 或 onType。
