React Native独立应用及iOS Release版本关闭8081端口后崩溃问题咨询

Hey there, it sounds like both your standalone dev build and iOS Release build are still relying on the Metro development server (running on port 8081) to load JavaScript resources. When you shut down the server, the app can't fetch the necessary code and crashes as a result. Let's break down how to fix this for both scenarios:

1. Fixing the Standalone Development Build #

If you want your dev build to work offline without needing the Metro server running, you have two options:

• Enable Offline Bundle (Temporary Fix)
  Shake your Android device (or press Cmd+D on iOS simulator) to open the developer menu, then select Enable Offline Bundle. This tells the app to use the cached JS bundle it already downloaded, so it won't try connecting to 8081 anymore.

• Package Offline Bundle into the Build (Permanent Fix)
  Generate a local JS bundle and assets, then recompile the app so it loads these offline resources by default:

  # For Android
  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/
  
  # For iOS
  npx react-native bundle --platform ios --dev false --entry-file index.js --bundle-output ios/main.jsbundle --assets-dest ios/
  

  After running the command for your platform, rebuild and run the app. It'll now use the local bundle instead of reaching for 8081.

2. Fixing the iOS Release Build #

Release builds should never depend on the Metro server—all JS code and assets need to be packaged directly into the IPA. Here's how to ensure that's happening:

• Verify the Xcode Build Script
  Open your iOS project in Xcode, go to Build Phases, and check that the Bundle React Native code and images script is present. This script automatically generates and packages the JS bundle during Release builds. It should look something like this:

  export NODE_BINARY=node
  ../node_modules/react-native/scripts/react-native-xcode.sh
  

  If it's missing, add it as a new "Run Script" phase.

• Manually Generate the Bundle (If Auto Script Fails)
  If the auto-script isn't working, generate the bundle manually before building:

  npx react-native bundle --platform ios --dev false --entry-file index.js --bundle-output ios/main.jsbundle --assets-dest ios/
  

  Then drag the main.jsbundle file into your Xcode project (make sure to check "Copy items if needed" when prompted).

• Clean Up Caches and Rebuild
  Corrupted caches can sometimes break the bundling process. Try these steps:

  1. In Xcode, press Cmd+Shift+K to clean the build folder.
  2. Delete Xcode's Derived Data: Go to Xcode > Preferences > Locations > Derived Data, click the arrow to open the folder, and delete everything inside.
  3. Clear React Native's cache:

     npx react-native clean
     npm install
     

  4. Rebuild the Release version in Xcode.

• Check Info.plist for Dev Configs
  Make sure your Release build doesn't have leftover development settings pointing to localhost:8081. Search your Info.plist for entries like localhost or 8081 and remove any that aren't necessary.

3. Troubleshooting with Crash Logs #

If you're still stuck, check the crash logs to confirm the root cause:

• For iOS, use Xcode's Organizer to view crash reports from your device.
• For Android, run adb logcat in your terminal to see real-time crash logs.
  Look for errors related to "failed to connect to localhost:8081" or "unable to load JS bundle"—these will confirm the issue is resource loading from the Metro server.

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