React Native 0.72升级后Android端修改Bundle路径启动崩溃问题

问题描述 #

通过创建React Native 0.72版本新模板并合并旧项目代码，将版本从0.66升级至0.72，同时将Android的compile和target SDK从33调整为34。在Android Studio中运行应用时启动后立即崩溃；尝试打包JS代码并将Bundle路径改为Metro服务器所在localhost，仍会崩溃。

复现步骤 #

未打包JS代码时：

• 安装依赖
• 启动Metro Bundler
• 在Android Studio中运行应用

已打包JS代码时：

• 安装依赖
• 执行命令：npx react-native bundle --platform android --dev true --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
• 启动Metro Bundler
• 在Android Studio中运行应用

React Native版本 #

0.72.0

受影响平台 #

运行时 - Android

npx react-native info输出 #

系统:
  操作系统: Windows 11 10.0.22631
  CPU: (8) x64 Intel(R) Core(TM) i5-8350U CPU @ 1.70GHz
  内存: 2.07 GB / 15.81 GB
二进制文件:
  Node:
    版本: 20.10.0
    路径: C:\Program Files\nodejs\node.EXE
  Yarn: 未找到
  npm:
    版本: 10.2.3
    路径: C:\Program Files\nodejs\npm.CMD
  Watchman: 未找到
SDK:
  Android SDK:
    API级别:
      - "28"
      - "29"
      - "30"
      - "31"
      - "33"
      - "34"
    构建工具:
      - 28.0.3
      - 29.0.3
      - 30.0.2
      - 30.0.3
      - 31.0.0
      - 33.0.1
      - 34.0.0
    系统镜像:
      - android-28 | Google APIs Intel x86_64 Atom
      - android-34 | Google APIs Intel x86_64 Atom
    Android NDK: 未找到
  Windows SDK: 未找到
IDE:
  Android Studio: AI-241.18034.62.2411.12071903
  Visual Studio: 未找到
语言:
  Java:
    版本: 11.0.22
    路径: /cygdrive/c/Program Files/Java/jdk-11/bin/javac
  Ruby: 未找到
npm包:
  "@react-native-community/cli": 未找到
  react:
    已安装: 18.2.0
    期望版本: 18.2.0
  react-native:
    已安装: 0.72.0
    期望版本: 0.72.0
  react-native-windows: 未找到
npm全局包:
  "*react-native*": 未找到
Android:
  hermesEnabled: true
  newArchEnabled: false
iOS:
  hermesEnabled: 未找到
  newArchEnabled: 未找到

堆栈跟踪/日志 #

未打包JS代码时：

FATAL EXCEPTION: create_react_context
    Process: com.mass_storage_mobile_app, PID: 14441
    java.lang.RuntimeException: 无法加载脚本。请确保你正在运行Metro（执行'npx react-native start'），或者你的bundle文件'index.android.bundle'已正确打包用于发布。
        at com.facebook.react.bridge.CatalystInstanceImpl.jniLoadScriptFromAssets(Native Method)
        at com.facebook.react.bridge.CatalystInstanceImpl.loadScriptFromAssets(CatalystInstanceImpl.java:239)
        at com.facebook.react.bridge.JSBundleLoader$1.loadScript(JSBundleLoader.java:29)
        at com.facebook.react.bridge.CatalystInstanceImpl.runJSBundle(CatalystInstanceImpl.java:268)
        at com.facebook.react.ReactInstanceManager.createReactContext(ReactInstanceManager.java:1413)
        at com.facebook.react.ReactInstanceManager.-$$Nest$mcreateReactContext(Unknown Source:0)
        at com.facebook.react.ReactInstanceManager$5.run(ReactInstanceManager.java:1111)
        at java.lang.Thread.run(Thread.java:1012)

已打包JS代码时：

FATAL EXCEPTION: main
    Process: com.mass_storage_mobile_app, PID: 12271
    java.lang.NullPointerException: 尝试在空对象引用上调用接口方法'void com.facebook.react.devsupport.interfaces.DevLoadingViewManager.showMessage(java.lang.String)'
    at com.facebook.react.devsupport.DevSupportManagerBase.showDevLoadingViewForUrl(DevSupportManagerBase.java:792)
    at com.facebook.react.devsupport.DevSupportManagerBase.reloadJSFromServer(DevSupportManagerBase.java:984)
    at com.facebook.react.devsupport.DevSupportManagerBase.reloadJSFromServer(DevSupportManagerBase.java:965)
    at com.facebook.react.devsupport.BridgeDevSupportManager.handleReloadJS(BridgeDevSupportManager.java:242)
    at com.facebook.react.devsupport.DevSupportManagerBase$10$1.onClick(DevSupportManagerBase.java:465)
    at com.android.internal.app.AlertController$ButtonHandler.handleMessage(AlertController.java:192)
    at android.os.Handler.dispatchMessage(Handler.java:106)
    at android.os.Looper.loopOnce(Looper.java:257)
    at android.os.Looper.loop(Looper.java:368)
    at android.app.ActivityThread.main(ActivityThread.java:8839)
    at java.lang.reflect.Method.invoke(Native Method)
    at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:572)
    at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1049)

解决方案 #

针对未打包JS时的脚本加载失败问题 #

1. 关闭现有Metro进程，执行npx react-native start --reset-cache清除缓存后重新启动，确保无端口冲突。
2. Android 10+模拟器中，将Metro服务器地址从localhost替换为10.0.2.2，保证设备能访问主机服务。
3. 检查android/app/build.gradle的debug模式配置，确保依赖引用正确：

   debugImplementation("com.facebook.react:react-native:0.72.0") {
       exclude group: 'com.facebook.fbjni'
   }
   

针对打包JS后的空指针崩溃问题 #

1. 使用生产环境参数打包JS，避免调试逻辑冲突：

   npx react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res
   

2. 检查MainApplication.java或MainActivity.java中DevSupportManager的初始化逻辑，确保调试组件配置符合RN 0.72要求，或暂时关闭调试模式测试。
3. 清除Android构建缓存：删除android/app/build和android/build目录，在Android Studio中执行File > Invalidate Caches... > Invalidate and Restart后重新构建。
4. 排查package.json中的依赖版本，替换为支持RN 0.72和SDK 34的最新版本。

通用排查步骤 #

• 确认AndroidManifest.xml添加了网络权限：<uses-permission android:name="android.permission.INTERNET" />
• 检查android/app/build.gradle中enableHermes = true配置正确
• 执行npx react-native doctor检查环境配置，根据提示修复问题

内容的提问来源于stack exchange，提问作者Saurabh D Vyas