VSCode中ESLint不报错而命令行正常,主因是VSCode默认使用全局ESLint而非项目本地版本;需设置eslint.packageManager为npm/pnpm、确保package.json存在且已安装依赖、检查状态栏提示、重启窗口,并优先使用.eslintrc.js而非eslint.config.js。

VSCode 里 ESLint 不报错,eslint 命令行却正常?
大概率是 VSCode 没找到项目里的 eslint,它默认用全局安装的版本,而你项目用的是本地 node_modules/.bin/eslint。
实操建议:
- 打开 VSCode 设置(
Ctrl+,),搜eslint.packageManager,设为npm或pnpm(和你项目一致) - 确认工作区根目录下有
package.json,且已执行过npm install(或对应包管理命令) - 检查 VSCode 右下角状态栏——点开 ESLint 图标,看是否提示 “ESLint server is not running” 或 “Using globally installed ESLint”;如果是后者,说明没走本地
- 重启 VSCode 或手动触发
Developer: Reload Window
配置文件不生效:.eslintrc.js vs eslint.config.js
ESLint v8.22+ 推出新格式 eslint.config.js,但 VSCode 的 ESLint 插件(截至 2024 年中)对它的支持还不稳定,尤其在多工作区或 monorepo 下容易漏读。
实操建议:
- 优先用传统
.eslintrc.js(导出对象)或.eslintrc.cjs(CommonJS),避免用eslint.config.js+defineConfig - 如果必须用新格式,确保 VSCode 插件版本 ≥ 2.4.0,并在设置中显式指定:
eslint.options→{"configFile": "./eslint.config.js"} -
.eslintrc.js里不要写export default,要用module.exports = {...},否则 Node.js 加载失败
JSX/TSX 文件不校验,或报 Parse errors in imported module
这是 parser 配置缺失的典型表现。ESLint 默认只认 JS,遇到 JSX、TypeScript 语法会直接卡在解析阶段,连规则都不跑。
实操建议:
- 装对 parser:
npm install --save-dev @typescript-eslint/parser(TS)或babel-eslint(旧项目),并在.eslintrc.js中配parser: "@typescript-eslint/parser" - 加
parserOptions.project(仅 TS):指向tsconfig.json路径,如"./tsconfig.json";不配这个,TS 类型检查类规则(如@typescript-eslint/no-unused-vars)基本不生效 - 确认
files或overrides里覆盖了**/*.tsx,否则 ESLint 根本不会处理这些文件
保存时自动修复失效,eslint.codeAction.onSave.mode 怎么设?
VSCode 的自动修复依赖两个开关:一个是插件级的启用开关,另一个是具体修复模式。很多人只开了前者,结果保存后没反应。
实操建议:
- 在设置里搜
eslint.codeAction.onSave.mode,值必须是all(不是problems,后者只修报错项,不修警告) - 同时确保
editor.codeActionsOnSave开启了"source.fixAll.eslint"(注意 key 是字符串,不是布尔值) - 如果用了 Prettier,别让两者冲突:关掉
prettier.eslintIntegration(已废弃),改用eslint-config-prettier关闭 ESLint 中和 Prettier 冲突的规则
最常被忽略的是 parser 和 parserOptions 的搭配——光装了 @typescript-eslint/parser,不配 project,TSX 文件就只能做基础语法检查;还有人把 eslint.config.js 放在子目录,但 VSCode 默认只从工作区根找,路径一错,整个配置静默失效。











