Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

What is the meaning of 'No bundle URL present' in react-native?

When I run a react-native project, I get a error no bundle URL present , but I don't know what mistakes I do, I was very confused.

enter image description here

like image 698
Yingch Xue Avatar asked Oct 09 '22 11:10

Yingch Xue


People also ask

Where is bundle react native code and images?

Open Project > Build Phases > Bundle React Native code and images. Apparently, by default it checks for an index. js file but since i'm using index. ts, it goes berzerk.

Can't connect to development server React native iOS device?

Try this. Open another terminal and run, react-native start — reset-cache. Then run, react-native run-android on your current terminal.

How create iOS react native?

Using React Native on macOS The React Native CLI is available as an npm package. Before installing it, make sure Xcode is installed on your system. This is where you build the native iOS code for React Native to use. As a first step, install Xcode from the App Store.


2 Answers

Solve the error No bundle URL present by:

  • Running the following command in your project root directory to delete the iOS build directory, and to kill other React Native sessions (assuming they're running on default port 8081) before re-building:

rm -rf ios/build/; kill $(lsof -t -i:8081); react-native run-ios

  • Update your React Native workflow to avoid these error occur by combining the above combination of commands into an alias and appending it to your Bash config file .bashrc with this command:

echo "alias rni=\"kill \$(lsof -t -i:8081); rm -rf ios/build/; react-native run-ios\"" >> ~/.bashrc; source ~/.bashrc

Now you can run React Native iOS build (without worrying about some of the common red error screens of death appearing) with a simple alias shortcut:

rni

like image 126
Luke Schoen Avatar answered Oct 12 '22 22:10

Luke Schoen


I just ran into this problem as well (first time getting started with React Native). The problem disappeared when - while an ios simulation(react-native run-ios) was running - I ran npm install and then react-native run-ios again. In the terminal window, it showed that it was bundling, and then the simulator showed the welcome screen.

Check this link for briefs after react-native init PropertyFinder line try to use npm start (This one works for me)

========================================================================

UPDATE for 16.9

My port 8081 was blocked by McAfee. Using a different port directly wasn't working react-native start --port=8082 and react-native run-ios --port=8082

Tried almost all solutions given here. but anything didn't work.

        "react": "16.9.0",
        "react-dom": "^16.12.0",
        "react-native": "0.61.5",

Solution:

Searched for 8081 in Xcode and replaced all of them with 8082. Then run the same commands to build and run the app. App works smoothly

react-native start --port=8082
react-native run-ios --port=8082

enter image description here

like image 45
Skip Suva Avatar answered Oct 12 '22 22:10

Skip Suva