npm run build未识别.eslintrc.json导致构建ESLint报错求助

问题分析 #

本地执行npm run lint完全正常，但npm run build时触发ESLint错误，核心原因是：react-scripts build内置的ESLint检查逻辑和直接调用的eslint .命令存在差异——要么是build时没有完全读取自定义.eslintrc.json配置，要么是extends规则的优先级冲突，导致已关闭/降级的规则在build阶段仍被触发。

具体解决方案 #

1. 强制react-scripts使用自定义ESLint配置 #

在项目根目录新建或修改.env文件，添加以下配置：

EXTEND_ESLINT=true

该配置会让react-scripts的build流程完全遵循.eslintrc.json中的规则设置，和npm run lint保持一致。

2. 修改build脚本，先执行lint检查 #

调整package.json的build命令，先跑lint检查，通过后再执行构建：

"scripts": {
  "build": "env-cmd -f .env.development eslint . && react-scripts build",
  "lint": "eslint .",
  // ...其他脚本
}

这样只要lint有错误就会终止流程，避免build阶段再出现ESLint问题。

3. 统一ESLint版本 #

检查本地ESLint和react-scripts内置的ESLint版本是否一致，版本差异可能导致规则解析不同：

# 查看本地ESLint版本
npm list eslint
# 查看react-scripts内置的ESLint版本
npm list react-scripts/node_modules/eslint

如果版本差异较大，建议升级或降级本地ESLint，和react-scripts内置版本对齐。

4. 排查规则优先级冲突 #

.eslintrc.json中extends数组的顺序会影响规则优先级（后面的规则覆盖前面的）。当前顺序是react-app → react-app/jest → plugin:react/recommended → airbnb → plugin:prettier/recommended，可能airbnb的某些规则覆盖了rules中设置的off/warn。

可以尝试调整extends顺序，比如把airbnb移到react-app前面，或者在rules中明确把build时触发的错误规则设为off或warn。

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