React Native Metro Bundler启动即崩溃问题求助

以下是针对所有React Native项目（包括Expo、RN CLI、Monorepo）的通用排查和修复步骤：

• 检查Node.js版本：Metro对Node版本有严格兼容要求，优先使用LTS版本（如18.x、20.x）。执行node -v查看当前版本，版本不符的话用nvm（Windows用nvm-windows）切换到兼容版本。
• 强制清空Metro缓存：缓存损坏是常见诱因，RN CLI项目执行npx react-native start --reset-cache，Expo项目执行expo start -c，彻底清除缓存后再启动。
• 重置项目依赖：删除项目根目录的node_modules文件夹、package-lock.json（或yarn.lock），执行npm cache clean --force（Yarn用户用yarn cache clean）清空全局缓存，最后重新执行npm install/yarn install。
• 修复npm全局路径权限：之前修改prefix可能未解决权限问题，执行npm config get prefix确认全局路径，确保该路径不在系统受保护目录（如C:\Program Files），可改为用户目录路径：npm config set prefix C:\Users\你的用户名\AppData\Roaming\npm（Windows）或npm config set prefix ~/.npm-global（Mac/Linux）。
• 排查端口占用：Metro默认使用8081端口，Windows执行netstat -ano | findstr :8081，Mac/Linux执行lsof -i :8081查看占用进程，杀掉对应进程后重新启动Metro。
• 临时关闭安全软件：部分杀毒软件或防火墙会拦截Metro的文件读写操作，临时关闭后测试，必要时将RN项目目录加入安全软件白名单。
• Monorepo额外配置：
  • 禁止依赖hoisting：在项目package.json中添加"nohoist": ["react-native", "metro", "metro-*"]，避免跨包依赖冲突。
  • 配置Metro路径解析：修改metro.config.js，添加monorepo的node_modules路径映射：

    const path = require('path');
    const { getDefaultConfig, mergeConfig } = require('@react-native/metro-config');
    
    const defaultConfig = getDefaultConfig(__dirname);
    const config = {
      resolver: {
        nodeModulesPaths: [
          path.resolve(__dirname, 'node_modules'),
          path.resolve(__dirname, '../node_modules'),
        ],
      },
    };
    
    module.exports = mergeConfig(defaultConfig, config);
    

• 重装Metro核心依赖：如果以上步骤无效，卸载并重新安装Metro相关包：

  npm uninstall metro metro-core metro-react-native-babel-preset
  npm install metro metro-core metro-react-native-babel-preset --save-dev
  

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