React-native: No bundle url present: when the React Packager tab is closed

[ecbrodie]

Description

This issue is spun off from #12754, to log a specific situation to create the "No bundle url present" error. I am running into the error message "No bundle URL present" in the iOS emulator when react-native run-ios is executed a subsequent time after a first successful execution. Specifically, once I close the terminal tab/window that spun off a React Packager process, I will run into this error.

I'm sure this screenshot is familiar from other React-Native issues, but here it is again:

Reproduction Steps and Sample Code

From a brand new project (not built)

1. Run react-native run-ios
2. Observe that a tab for React Packager is spun off. As a part of it execution, the following line will appear in output:
   > Bundling index.ios.js ... done
3. Observe that the iOS emulator is able to run the project successfully
4. Close both the emulator and the tab for React Packager
5. Run react-native run-ios again
6. Observe that both the React Packager tab and the emulator will open. However, the "Bundling index.ios.js" will not appear and the error screen in the emulator will occur.

From a project already built

1. Run react-native run-ios
2. Similar to the last step above, the error in the emulator will occur. Also, the "Bundling index.ios.js" will not appear in the React Packager tab. So basically in this situation, we get to the error even faster than before.

Solution

The following workarounds exist, although each of them has their own reason why they are undesirable workarounds:

• Remove the built iOS code via rm -rf ios/build. However, this defeats the purpose of the code-reloading that React Packager offers, since I would have to wait for a full rebuild every time I want to test out new changes.
• Keep the React Packager tab always open. However, I find it unreasonable to enforce this requirement on development environments (for example, developers would not be able to turn off their computers, or else this bug would occur again after the computer restarts).
• Immediately run react-native run-ios again. But there seems to be redundancy, slowness and sloppiness in this solution, having to run a command a second time just to avoid an error.

Additional Information

• React Native version:
  $ react-native --version react-native-cli: 2.0.1 react-native: 0.44.0
• Platform: iOS
• Development Operating System: MacOS 10.12.4
• Dev tools: Xcode, using the iOS 9.3 simulator

[jsonz1993]

mark

[mosesoak]

Some members of my team are having this same issue while running from Xcode.

[email protected]

Workaround: stop the packager, clean Xcode (cmd-shift-K), re-run.

Time suck

[fengjiankang]

I have met the same problem. But I run it normally online in the simulator and device. But I make a offline bundle. The problem perform. RN version 0.44

[MatthewJamesBoyle]

Facing the same issue but deleting the build folder does not resolve it. Been stuck on this for a couple of days now.
error I see in console:
node_modules/react-native/packager/launchPackager.command: line 16: ./packager.sh: No such file or directory ~

[ecbrodie]

@hramos I extracted my specific bug from the original bloated issue thread #12754 as you requested, but it has not received any attention from either you or anyone from the React-Native team. What more needs to be done to get this issue triaged?

[hramos]

@ecbrodie we're still going through 1,000 or so remaining issues (all opened in the last two months), sorry

[austinkettner]

Can confirm a temporary solution is to downgrade to React Native 0.44 unless you critically need something in 0.45

[shamjam]

I got rid of the error by building the project on xcode: https://www.youtube.com/watch?v=e-2KARCog18

[nicoboy11]

@MatthewJamesBoyle I have the same issue... did you manage to solve it?

[tobyf93]

I have found the easiest/quickest way to bypass this is to exit the app within the simulator (2 x Cmd + Shift + H) and re-launch.

[MatthewJamesBoyle]

@nicoboy11 yep, I solved it by building a native android app!

[paulbib]

this is solved my issue:
info.plist → information Property List → + App Transport Security Settings → + Allow Arbitrary Loads = YES

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Maybe the issue has been fixed in a recent release, or perhaps it is not affecting a lot of people. If you think this issue should definitely remain open, please let us know why. Thank you for your contributions.

[ProteanDev]

SOLUTION:

• DELETE the ..ios/build folder
• Use this https://www.npmjs.com/package/react-native-clean-project
  In any order.

Do not forget to do react-native link if you use any library that needs that

The reason this fixes the problem is because ..ios/build ISN'T getting updated when we change project paths or simply when we change our project directory. There's no way the bundler will be able to track the changes so it sticks with the last known paths.

Don't overthink it, we already did. This however still needs to be automated by RN team.

[gengjiawen]

@paulbib 's solution works for me, I have created a pr https://github.com/facebook/react-native/pull/19643.

[tarikchakur]

I faced this error on the simulator too, after deleting the default NSAppTransportSecurity configuration from my plist file in iOS for production purpose, as a consequence The simulator couldn't fetch the bundle file.

<key>NSAppTransportSecurity</key>
<dict>
    <key>NSExceptionDomains</key>
    <dict>
        <key>localhost</key>
        <dict>
        <key>NSExceptionAllowsInsecureHTTPLoads</key>
        <true/>
        </dict>
    </dict>
</dict>

[devyu]

I figure it in my project, In your project target → info.plist → information Property List → + App Transport Security Settings → + Allow Arbitrary Loads in Web Content = YES

my project environment：

macOS 10.14.1 (18B75),
XCode 9.2,

"react": "16.6.1",
"react-native": "0.57.5"