Monorepo架构下VSCode中Next.js的ESLint无法正常工作

以下是针对你的Monorepo中Next.js ESLint失效问题的排查与解决步骤：

• 确认Next.js项目ESLint依赖完整性
  进入services/ssr目录，重新执行npm install。Docker挂载可能因缓存或权限问题导致eslint、eslint-config-next等核心依赖安装不完整，这是常见的隐性问题。

• 手动指定配置文件验证ESLint功能
  在项目根目录执行以下命令，强制ESLint使用Next.js子目录的配置文件：

  npx eslint services/ssr/src --config services/ssr/.eslintrc.json
  

  如果此时能检测到你故意留下的未使用变量错误，说明ESLint本身能识别配置，但默认扫描逻辑未找到子目录的配置文件。

• 调整VSCode ESLint工作目录配置
  修改VSCode的settings.json，将工作目录配置改为带mode的对象形式，让ESLint自动适配子目录的环境：

  {
    "eslint.workingDirectories": [
      { "directory": "./services/api-main", "mode": "auto" },
      { "directory": "./services/ssr", "mode": "auto" }
    ]
  }
  

  同时检查eslint.exclude配置，确保没有将services/ssr目录加入排除列表。

• 使用Next.js自带的lint命令
  Next.js脚手架生成的npm run lint实际是next lint，这个命令会自动适配Next.js的文件类型（如tsx、jsx）和配置逻辑，比直接调用eslint命令更可靠。进入services/ssr目录执行：

  npm run lint
  

  如果一定要用原生eslint命令，需明确指定文件扩展名：

  npx eslint services/ssr/src/**/*.{js,jsx,ts,tsx}
  

• 排查Docker环境的权限与路径问题

  1. 通过docker exec <容器ID> ls -l /path/to/services/ssr确认容器内用户对该目录有读写权限，权限不足会导致ESLint无法读取配置或文件。
  2. 验证本地目录与容器内的映射路径是否完全一致，避免ESLint扫描错误路径。

• 手动添加规则测试配置有效性
  修改services/ssr/.eslintrc.json，手动开启未使用变量的规则，验证配置是否生效：

  {
    "extends": "next/core-web-vitals",
    "rules": {
      "no-unused-vars": "error"
    }
  }
  

  执行lint命令后若能检测到未使用变量，说明原默认配置的规则范围未覆盖你测试的场景。

内容的提问来源于stack exchange，提问作者Koy