React项目修改文件编译失败：Failed to load config 'react-app'

针对你在WSL Ubuntu环境下遇到的问题——修改React项目文件时触发ESLint报错Failed to load config "react-app" to extend from，但保存package.json就能临时恢复，以下是几个实用的解决方案：

1. 清除ESLint缓存 #

ESLint的缓存可能在WSL环境下出现路径解析异常，直接清除缓存即可：

yarn eslint --clear-cache

也可以手动删除ESLint缓存文件（通常位于~/.eslintcache或项目根目录下的.eslintcache），之后重启项目。

2. 强制重新安装依赖 #

WSL跨文件系统安装依赖时可能出现文件不完整的情况，强制重装能修复依赖缺失：

rm -rf node_modules yarn.lock
yarn install --force

重装完成后重启yarn start。

3. 明确指定ESLint配置路径 #

在package.json的eslintConfig中直接指向eslint-config-react-app的本地文件，避免路径解析错误：

"eslintConfig": {
  "extends": [
    "./node_modules/eslint-config-react-app/index.js",
    "./node_modules/eslint-config-react-app/jest.js"
  ]
}

修改后保存package.json，重启项目。

4. 禁用ESLint缓存启动 #

修改package.json中的start脚本，添加--no-eslint-cache参数，彻底避免缓存问题：

"scripts": {
  "start": "react-scripts start --no-eslint-cache",
  "build": "react-scripts build",
  "test": "react-scripts test",
  "eject": "react-scripts eject"
}

5. 检查项目目录位置 #

确保你的项目放在WSL原生文件系统中（比如/home/your-username/下），而非挂载的Windows目录（如/mnt/c/）。Windows挂载目录的权限和文件系统特性可能导致ESLint无法正确读取配置文件。

为什么保存package.json能临时解决？ #

保存package.json会触发react-scripts重新加载项目配置，重置ESLint的运行状态，相当于临时绕过了缓存或路径解析的异常，但无法根治问题，仍需通过上述方案彻底修复。

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