React Native开发服务器返回500错误及相关问题求助

错误截图 #

1. 修复依赖缺失与缓存损坏 #

• 删除本地依赖文件夹并重装：

  rm -rf node_modules && npm install
  

• 强制清理npm缓存：

  npm cache clean --force
  

• Yarn用户执行：

  rm -rf node_modules && yarn install && yarn cache clean
  

2. 重置Metro构建缓存 #

Metro缓存异常是500错误的高发原因，执行重置命令后重启服务：

npx react-native start --reset-cache

保持Metro服务运行，新开终端启动Android项目：

npx react-native run-android

3. 处理空文件夹与构建目录问题 #

• 若空文件夹是Android构建目录（如android/app/build），先清理旧构建文件再重新编译：

  cd android && ./gradlew clean && cd .. && npx react-native run-android
  

• 检查项目目录权限，避免因权限不足导致文件生成失败：

  sudo chmod -R 755 ./你的项目目录
  

4. 修正网络与服务器配置 #

• 确认模拟器/真机与电脑在同一局域网，检查8081端口是否被占用：

  lsof -i :8081 # macOS/Linux查看端口占用
  taskkill /F /PID 进程ID # Windows杀掉占用进程
  

• 真机扫码失败时，手动指定服务器地址：摇开开发者菜单，选择「Change Bundle Location」，输入http://你的电脑IP:8081/index.bundle?platform=android&dev=true&minify=false

5. 验证版本兼容性 #

• 核对本地React Native CLI与项目依赖版本：

  npx react-native --version
  

• 若版本不匹配，切换到项目指定的稳定版本（以0.72.0为例）：

  npm install react-native@0.72.0
  

6. 查看详细错误日志 #

保持Metro终端窗口处于打开状态，仔细阅读输出的错误信息——通常500错误会附带具体的模块缺失、语法错误或配置问题提示，这是定位根源的核心依据。

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