React Native using pre-bundled file on device, even if DEV-mode

Question

A few days ago, when I build and run my react native app from Xcode on a device, I realised that even if I set my scheme to Debug, the app is still loading from a pre-bundled file. Other than that, everything else is like developer-mode. I can shake the device and the developer meny pop ups, in the console I get output, and react native also logs:

Running application "XXXXX" with appParams: {"rootTag":1,"initialProps":{}}. DEV === true, development-level warning are ON, performance optimizations are OFF

So when I try to reload from the developer meny, it indeed reloads but with the message

Loading from pre-bundled file

I have tried to delete the app, verify Debug-scheme, clean build, and the build and run again, without any different outcome.

Does anyone have a clue what could have caused this (I have been running the app before with Release Scheme, but never have had this issue), and how I can get back to "normal"?

Unfortunately I do not know how to reproduce this.

Xcode: 8.2.1
React-native: 0.40.0

Thank you for your time!

Solved

In my case, it was as @while1 pointed out regarding the wifi. My device and computer where not connected to the same wifi. I however found a network at my working place where it still didn't work, even if both computer and device connected to this network (protected somehow maybe?). ANyway, when I shared my internet connection to my computer from my iPhone, the app finally loaded the data from my computer. So it indeed was the iPhone not being able to connect to my computer, and therefore loading a pre-bundled file.

score 36 · Accepted Answer · answered Jan 18 '17 at 07:59

36

In react native 0.40.0, React native try to guess bundle location by itself. Please see if following points can help:

Make sure your AppDelegate.m have this line:jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index.ios" fallbackResource:nil];
Check your device and your Xcode mac is running on same wifi. Internally for IOS, react native try to guess ip by itself.
Try running app first through command line, so dev packager server is running and then run app through xcode in your device.

answered Jan 18 '17 at 07:59

while1

3,320
19
12

1

Perfect! My issue was that the iPhone and my computer where connected to different wifi. Saved my day! :) – Viktor Nilsson Jan 18 '17 at 08:23
1

@ViktorNilsson in my case, internet on the wifi went down, but was working on computer since it was also connected to a LAN. I restarted my Router and as soon as the internet was restored, it worked. – Shubham Ojha Jul 10 '19 at 08:58

score 13 · Answer 2 · answered Jan 18 '17 at 07:43

13

so your problem is here:

Change code in your AppDelegate.m:

jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"]; // comment this line

jsCodeLocation = [NSURL URLWithString:@"http://xxx.xxx.x.xx:8081/index.ios.bundle?platform=ios&dev=true"]; //uncomment this line

Cheers:)

answered Jan 18 '17 at 07:43

Codesingh

3,316
1
11
18

I should not need to do this right? Before I have just toggled the scheme and it loaded the resources from the right place without modifying any code. – Viktor Nilsson Jan 18 '17 at 07:51
what you need to do is enable the localhost not the pre loaded bundle and i am sure that will work. May there would be chance of different code as react native keep on changing it's code with new version. – Codesingh Jan 18 '17 at 08:02
2

In react native 0.40.0, neither of those lines exist, but I sure do recognise them from earlier version of react native. In my case, while1 pointed out the solution (same wifi). Thanks for your input however. – Viktor Nilsson Jan 18 '17 at 08:25
Welcome brother :) – Codesingh Jan 18 '17 at 08:42
Despite those lines not existing, if you add the second one and comment the existing `jsCodeLocation`, it will work. – connorbode Aug 07 '17 at 14:16
I recommend using the `#ifdef DEBUG` preprocessor directive – Jan Kalfus Aug 21 '17 at 13:02

Krishna Mudhiraj · Answer 3 · 2018-07-16T12:38:50.067

6

As i have faced same problem and above points didn't work for me. i got it worked by doing these steps.

Go to xcode-> your project-> info.plist
In "App Transport Security settings" make "Allow Arbitrary Loads" Yes.

it should fix this issue.

edited Jul 16 '18 at 12:38

answered Jul 16 '18 at 12:18

Krishna Mudhiraj

101
2
4

score 3 · Answer 4 · answered Aug 21 '17 at 13:20

For those who are connected to the same Wi-Fi, but to a different IP address than localhost (you've set it up in RCTWebSocketExecutor.m):

Check Xcode debug console, if you can find the following error:

App Transport Security has blocked a cleartext HTTP (http://) resource load since it is insecure. Temporary exceptions can be configured via your app's Info.plist file.

Use the following answer: https://stackoverflow.com/a/32704702/3979621
And then use Codesingh's answer. BTW I recommend using the #ifdef DEBUG directive as follows, so that you don't have to change it manually when switching between build variants:

.

#ifdef DEBUG
  jsCodeLocation = [NSURL URLWithString:@"http://xxx.xxx.xxx.xxx:8081/index.ios.bundle?platform=ios&dev=true"];
#else
  jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index.ios" fallbackResource:nil];
#endif

score 0 · Answer 5 · answered Apr 26 '18 at 20:07

0

in my case it was a (for react native) unexpected networksetting, so it grepped the wrong ip.

Check the Build report if your ip is correctly detected

react native docs

answered Apr 26 '18 at 20:07

Benni

69
1
4

score 0 · Answer 6 · answered Oct 16 '18 at 12:31

For me, I had accidentally clicked Deny instead of Allow on a macos popup asking whether to accept incoming network connections to «node».

Opening System Preferences -> Security & Privacy -> Firewall -> Firewall options, and finding the line for node that was set to block, then correcting it to allow solved my problem!

score 0 · Answer 7 · answered Nov 07 '18 at 16:40

For me, this happened after updating my mac to Mojave. Turns out that with the update the firewall settings changed to block all incoming connections... Thank you Stian Jensen for getting me on the track of checking my firewall!

What I did:

Open System Preferences -> Security & Privacy -> Firewall -> Firewall options
Uncheck "Block all incoming connections"
Make sure that the connections listed are from sources that you trust

arkan4ik92 · Answer 8 · 2021-10-11T05:53:51.600

Firstly check your internet connection. It should be the same. Also need to check these steps if nothing help you.

Before checking steps:
-Restart XCode.
-Get off cable from the phone and put it again.

Check if you have in build phases related to react native.

Check if you have permission to load it locally App Transport Security Settings, Allow Arbitrary Loads Exception Domains, localhost, NSExceptionAllowsInsecureHTTPLoads

Check if you build debug version. Xcode - product - Scheme - Edit Scheme...

React Native using pre-bundled file on device, even if DEV-mode

Solved

8 Answers8

Linked