eslint是唯一真正落地的javascript代码自动检测方案,vscode内置校验器仅支持基础语法错误;需安装官方扩展、配置正确文件路径与格式、关闭javascript.validate.enable、匹配语言模式并确保本地安装。

ESLint 是唯一能真正落地的 JavaScript 代码自动检测方案,VSCode 自带的 javascript.validate.enable 只能捕获极基础的语法错误(比如少个括号),对未定义变量、拼写错误、逻辑隐患完全沉默。装了插件却没标红?不是插件坏了,是配置链断在某个环节。
确认 ESLint 扩展已安装且启用
别只搜“eslint”,必须安装由 Dirk Baeumer 发布的官方扩展(ID:dbaeumer.vscode-eslint)。其他同名插件可能不兼容最新规则或 LSP 协议。
- 打开扩展面板(Ctrl+Shift+X),搜索
ESLint,认准作者名和下载量最高的那个 - 安装后**重启 VSCode**——很多用户跳过这步,导致扩展未激活
- 检查右下角状态栏:如果显示
ESLint图标(绿色勾或黄色感叹号),说明扩展已加载;若无图标,说明没识别到项目配置
项目根目录必须有可识别的 ESLint 配置文件
ESLint 扩展默认只读取项目根目录下的配置文件,且格式优先级严格:.eslintrc.cjs > .eslintrc.js > .eslintrc.json。用错格式或放错位置,等于没配。
使用 JSON Schema 验证 JSON 数据,从示例 JSON 生成 schema,并将其转换为 TypeScript 接口、Python 数据类或 Markdown 文档。
- 推荐用
.eslintrc.cjs:支持module.exports = { ... },兼容 CommonJS,避免 ESM 语法(如export default)导致静默失败 - 配置文件不能放在子目录里——即使你
cd进 src 目录打开文件,VSCode 仍以工作区根为基准查找 - 如果用
pnpm或bun,确保eslint是本地安装(pnpm add -D eslint),全局安装的工具ESLint扩展通常找不到
检查 VSCode 设置是否禁用了关键开关
常见现象:配置文件写了,扩展装了,但保存后毫无反应。大概率是 javascript.validate.enable 和 eslint.enable 冲突,或格式化开关设反了。
- 打开
settings.json(Ctrl+Shift+P →Preferences: Open Settings (JSON)),确认含以下两项: -
"eslint.enable": true(必须显式开启) -
"javascript.validate.enable": false(必须关掉内置校验器,否则它会抢在 ESLint 前报错,且规则更弱) - 如果同时用
Prettier,确保"editor.formatOnSave": true,但"eslint.format.enable"必须为false,否则和 Prettier 冲突
语言模式必须匹配 JSX/TSX 场景
右下角状态栏显示的不是 JavaScript,而是 JavaScript React 或 TypeScript React——这是关键信号。纯 JavaScript 模式会跳过所有 React/Hooks 相关规则(比如 react-hooks/rules-of-hooks)。
- 打开一个
.jsx或.tsx文件,点击右下角语言模式(如 “Plain Text”),选择JavaScript React或TypeScript React - 这个设置可存为工作区偏好:在
.vscode/settings.json中加"files.associations": { "*.jsx": "javascriptreact", "*.tsx": "typescriptreact" } - 如果项目用 Vite/Svelte 等框架,需额外安装对应插件(如
eslint-plugin-vue)并在extends中声明
javascript.validate.enable 没关、语言模式选错、或 ESLint 根本没在本地 node_modules 里。先盯住这四点,比重装插件管用十倍。










