React项目执行react-scripts build时编译失败求助

这个错误本质是React核心版本与项目依赖（尤其是react-scripts或其他React生态库）不兼容导致的，以下是针对性的排查和修复步骤：

1. 统一React核心版本并重装依赖 #

• 先确认package.json里react和react-dom版本一致，且与react-scripts版本匹配（比如react-scripts@5.x适配react@17.x或react@18.x）
• 手动指定稳定版本重新安装：

  yarn add react@^18.2.0 react-dom@^18.2.0 --exact
  

• 清理旧依赖后重装：

  rm -rf node_modules yarn.lock
  yarn install
  

2. 排查依赖树中的版本冲突 #

• 用命令查看是否有第三方依赖偷偷引入了不兼容的React版本：

  yarn list react
  

• 如果发现冲突，在package.json中添加resolutions强制统一版本：

  "resolutions": {
    "react": "^18.2.0",
    "react-dom": "^18.2.0"
  }
  

  添加后重新执行yarn install。

3. 调整react-scripts版本 #

• 若当前react-scripts版本与React核心不匹配，可升级到最新稳定版：

  yarn upgrade react-scripts@latest
  

• 或降级到已知兼容的版本（比如React 17适配react-scripts@4.0.3）：

  yarn add react-scripts@4.0.3 --exact
  

4. 清理Azure CI/CD缓存 #

• Azure流水线可能缓存了旧依赖，在安装依赖步骤前添加缓存清理命令：

  yarn cache clean
  

• 同时在流水线任务中启用「Clean」选项，确保每次构建从干净环境开始。

5. 排查自定义配置干扰 #

• 如果项目有自定义Babel或Webpack配置，暂时移除这些自定义内容，重新执行react-scripts build，验证是否是配置导致的导入逻辑异常。

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