

新闻资讯
行业动态ESLint在VSCode不生效需同时满足三条件:本地安装eslint、启用官方ESLint插件、项目根目录存在有效配置文件(如.eslintrc.js或package.json含eslintConfig);TypeScript+React项目还需配置@typescript-eslint/parser及插件,并正确设置parser和plugins。
VSCode 里 ESLint 不生效?先确认插件和项目依赖是否齐备ESLint 在 VSCode 中不报错、不提示,大概率不是配置问题,而是基础环境缺失。必须同时满足三个条件:eslint 包已安装、eslint 插件已启用、工作区有可识别的配置文件。
eslint 必须是本地安装(npm install eslint --save-dev),全局安装(npm install -g eslint)在多数 Workspace 场景下会被 VSCode 忽略ESLint(作者:Microsoft),禁用其他非官方 ESLint 相关插件(如 “ESLint Snippets” 等).eslintrc.js、.eslintrc.cjs、.eslintrc.json 或 package.json 中含 eslintConfig 字段——VSCode 的 ESLint 扩展默认只读取这些路径下的配置TypeScript 和 React 的语法扩展需要额外配置解析器和插件,否则会大量报 Parse errors 或 no-unused-vars 误报。
@typescript-eslint/parser 和 @typescript-eslint/eslint-plugin(推荐用 --save-dev).eslintrc.cjs 中明确指定 parser 和 plugins,例如:module.exports = {
parser: '@typescript-eslint/parser',
plugins: ['@typescript-eslint'],
extends: [
'eslint:recommended',
'plugin:@typescript-eslint/recommended',
],
parserOptions: {
ecmaVersion: 2025,
sourceType: 'module',
ecmaFeatures: {
jsx: true,
},
},
rules: {
'no-unused-vars': 'off',
'@typescript-eslint/no-unused-vars': 'warn',
},
};
create-react-app,不要手动装 eslint-plugin-react;CRA v5+ 内置了 eslint-config-react-app,直接 extends: ['react-app'] 更稳妥VSCode 的 eslint.autoFixOnSave 已被废弃,新版本必须改用 editor.codeActionsOnSave 配置,且仅对支持 fix 的规则生效。
.vscode/settings.json 中添加:"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
meta.fixable === "code" 的项(比如 semi、quotes 可修;no-console、complexity 不可修)Ctrl+Shift+P),运行 ESLint: Show Output Channel,查看输出中是否有 Failed to load config 或 No ESLint configuration found 提示当用 code .code-workspace 打开多个文件夹时,ESLint 默认只读取第一个文件夹的配置,其余子文件夹的 .eslintrc 会被忽略。
eslint 和对应插件(不能靠根目录的 node_modules)eslint.packageManager 的自动推断(设为 "npm" 或 "yarn" 显式指定),避免跨文件夹误用包管理器路径@myorg/eslint-config),各子项目通过 extends 引入,而非复制配置文件最常被忽略的是:ESLint 配置的加载路径完全依赖当前编辑文件的磁盘位置,而不是 VSCode 窗口的打开方式。哪怕一个 JS 文件被拖进多根工作区,只要它物理路径不在任一已加载文件夹内,ESLint 就不会启动。