Why Is React Native Launching From A Pre-Bundled File?

Alexander Paterson
Posted over 6 years ago
2 minutes
Why Is React Native Launching From A Pre-Bundled File?
Looks like you forgot to update your AppDelegate file

React native is tricky. It's tricky because there aren't hundreds of stack overflow questions describing every small problem you might encounter. When I was getting started, I'd often find my app was launching from a pre-bundled file and I wouldn't know how to fix it:

Loading from pre-bundled file

For reference, you can bundle your javascript for production with the following command:

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

For iOS, the reason is a line in AppDelegate.m that sets the location of the javascript source code. For production, you want your app to read javascript from a pre-bundled file, but in production, you want it to get javascript from the react native development server.

// Development
jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index.ios" fallbackResource:nil];

// Production  
jsCodeLocation = [[NSBundle mainBundle] URLForResource: @"main" withExtension: @"jsbundle"];

Whether a pre-bundled file will actually be generated, and whether your app will have access to the in-app development menu depends on the build configuration of your app. You can switch the build configuration between Debug and Release from the Edit Schemes menu.

Edit Scheme Menu

Edit Scheme Menu

So that makes two things you need to change when you go from development to production builds: AppDelegate, and your build configuration.

Hope this helps.