Reputation: 7139

error "Could not get BatchedBridge, make sure your bundle is packaged properly" on start of app

Trying to create a react-native project on Android 4.4.2 I get this error screen

and couldn't find any way to resolve it. I tried restarting packager, reconnecting device, even reinstalling react native and starting new project. On 6.0.0 and later versions it works just fine.

Upvotes: 211

Answers (30)

Anandu K Dev

Reputation: 29

I got the same issue and exit the terminal and re run the application helps me!

Upvotes: 0

Muhammad Areeb

Reputation: 316

terminating the metro bundler and installing the app again works for me

Upvotes: 0

RimApp

Reputation: 13

In Settings, go to Privacy > Local Network to see a list of every app that requested access. I solved by allowing my app to access to the local network. (Trying to run on physical iPhone device from my mac m1 on the same wifi).

Source

Upvotes: 0

Muhammad Abdullah Nabeel

Reputation: 164

I simply interrupted my running application, run npm i and then started application again by npm start and it worked fine.

Upvotes: 0

rnewd_user

Reputation: 1672

your app is running already, then stop and again run % npx react-native run-ios

Upvotes: 0

AbdulmateenChitrali

Reputation: 399

For me i just kill all the terminal inside visual code studio and open cmd where i run bellow two command

npx react-native start
npx react-native run-android

this is worked for me hope also work for you happy coding 😊😊

Upvotes: 0

Juggernaut.dev

Reputation: 86

If you are using expo and you are running it on a physical device, I would advise to kill the metro bundler then expo start and try it

Upvotes: 0

OneOfOne

Reputation: 99421

In my case, it was jsEngine: 'hermes' under the android subsection, removing it fixed the production build.

Upvotes: 0

Irshad Babar

Reputation: 1419

someone suggested the following one

react-native run-android react-native start --reset-cache,

But in my case, I just close the cli command prompt window and used the following.

npx react-native run-android

and it worked fine.

Upvotes: 3

TripleM

Reputation: 1252

"npm start"

I just closed the terminal and open a new one. Went to project location by cd command. And then just simply type - "npm start". and then 'r' for reload. Everything just vanished. I think everybody should try this at once.

Upvotes: 1

DeepakPanwar

Reputation: 1389

Most of us face this problem for the first time, when we start react native project#1.

Few simple steps solved my problem:

I created a sample project using command:

react-native init ReactProject1

Solution

The fix is to help local-cli\runAndroid\adb.js to find adb.exe, the same way as local-cli\runAndroid\runAndroid.js:

find replace statement under projectname(whatever you have given)\node_modules\react-native\local-cli\runAndroid

Replace:

const devicesResult = child_process.execSync('adb devices');

By:

const devicesResult = child_process.execSync( (process.env.ANDROID_HOME ? process.env.ANDROID_HOME + '/platform-tools/' : '') + 'adb devices');

after doing above replacement, just run react-native run-android in your cmd, it will bundle apk and at first try to install js bundle locally in your device. (Got Success)

Upvotes: 1

Jason

Reputation: 933

Easiest Way!

Stop server and end project build.
Open a 'Node.js' terminal.
- Navigate to folder with 'react-native' project.
- Type 'react-native start' --Starting the react native server manually.
Go to your Code Editor Terminal and type 'react-native run-android.

You're good to go!

Upvotes: 0

Sergii Dolgushev

Reputation: 379

Please check if you have following error when you run react-native run-android: adb server version (XX) doesn't match this client (XX); killing...

In that case make sure /usr/local/opt/android-sdk/platform-tools/adb and /usr/local/bin/adb are pointed to the same adb

In my case one was pointed to /Users/sd/Library/Android/sdk/platform-tools/adb (Android SDK), but another was pointed to /usr/local/Caskroom/android-platform-tools/26.0.2/platform-tools/adb (Homebrew)

And issue have been fixed after both of them pointed to /Users/sd/Library/Android/sdk/platform-tools/adb (Android SDK)

Upvotes: 2

Martin Choraine

Reputation: 2431

I got the same issue but it was a stupid mistake from myself...

From Android studio, I was launching installDebug/installRelease gradle script from app projet instead of root projet.

Upvotes: 0

tbo

Reputation: 9842

A possible solution for this is that you most probably not bundling your application first, perform the following steps and then deploy your app-debug.apk to your device

$ cd myproject  
$ react-native start > /dev/null 2>&1 &  
$ curl "http://localhost:8081/index.android.bundle?platform=android" -o "android/app/src/main/assets/index.android.bundle"

(if the folder assets does not exists create it)

Then run from project root

$> (cd android/ && ./gradlew assembleDebug)

install the created apk to you device, from location: android/app/build/outputs/apk/app-debug.apk

let me know if that fixes your issue

EDIT:

You can simply put it to your package.json as a script to automate it, I believe it will be fixed in upcoming releases of react-native and will be executed prior assembling the final APK, hence this won't be needed (I hope as well)

put :

"scripts": {
    "build": "(cd android/ && ./gradlew assembleDebug)",
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "bundle-android": "react-native bundle --platform android --dev false --entry-file index.android.js --bundle-output android/app/src/main/assets/index.android.bundle --sourcemap-output android/app/src/main/assets/index.android.map --assets-dest android/app/src/main/res/"
  },

or as mentioned the curl equivalent, but for most cases the above is more robust

Upvotes: 153

Hitesh Sahu

Reputation: 45160

Try to clean cache

react-native start --reset-cache

Upvotes: 2

niceman

Reputation: 361

For me the problem was that 'adb' was not recognised - check this answer.

To fix this add C:\Users\USERNAME\AppData\Local\Android\sdk\platform-tools to Environment Variables

Upvotes: 1

Sebastian Vorac

Reputation: 4743

I had the same problem. When I did create a react native project via create-react-native-app AwesomeProject it worked well in Expo app on phone. After that I wanted to use that quickstart project for developing my project and got same error as you do.

After some research I find out it's better to start new project with react-native init AwesomeProject (with all setting in react native docs) Then run this command:

react-native bundle --platform android --dev false --entry-file index.android.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res/

That should fix the thing with bundle (--dev false is not showing warnings)

All you need to do for app to run on your virtual / real device is:

react-native run-android

And it should be working just fine. At least it worked for me.

Upvotes: 2

Shamsher

Reputation: 1761

It's little too late but this really works for me.

react-native run-android.
react-native start.

First command will build apk for android and deploy it on your device if its connected. When you open the App it will show red screen with error. Then run second command which will run packager and build app bundle for you.

Upvotes: 7

SpencerL

Reputation: 66

My issue was that I went through my AndroidManifest.xml file and had removed the line

<uses-permission android:name="android.permission.INTERNET" />

because my app will not need internet. However, the react native debugging app does need internet access (to access the packager) Whoops. :)

Upvotes: 2

M. Solle

Reputation: 44

I found that I needed to also add in a

react-native upgrade

to get the application to run correctly.

Upvotes: 0

alexfigtree

Reputation: 1556

I tried many of the suggestions above/below, but ultimately, the issue I faced was a permissions one with watchman, which was installed using homebrew earlier. If you look at your terminal messages while trying to use the emulator, and encounter 'Permission denied' errors with regards to watchman along with this 'Could not get BatchedBridge" message on your emulator, do the following:

Go to your /Users/<username>/Library/LaunchAgents directory and change the permissions settings so your user can Read and Write. This is regardless of whether or not you actually have a com.github.facebook.watchman.plist file in there.

Upvotes: 0

ThienSuBS

Reputation: 1622

My way are:

react-native start

After that in your device using:

click to Reload.

See in console react-native, it will be fetch js bundle data.

Upvotes: 2

Brijmohan Karadia

Reputation: 447

In a separate terminal, connect your device to the computer and run the following commands:

react-native start 
cd user/Library/Android/sdk/platform-tools/
./adb reverse tcp:8081 tcp:8081

Application terminal:

react-native run-android 
install apk on your device from this location android/app/build/outputs/apk/app-debug.apk

Upvotes: 7

Luiz Henrique Martins Lins Rol

Reputation: 2599

It had this issue "randomly" and took me sometime to realize what was wrong in my scenario.

After I have updated to React-native-cli 2.0.1, there was a message output to the log which helped me to dig and find the root cause:

JS server not recognized, continuing with build...

After researching some links I found this one:

Unable to recognize JS server

Since I´m on windows, I ran netstat and found out that my VLC player was also running on port 8081 causing the issue. So, in my case, if I started the vlc server prior to the react-native server it wouldn´t work.

This same log message wasn´t output on previous versions of the react-native-cli, making it fail silently.

TL, DR: check if there´s anything running on the same port as the package manager (8081 by default)

Upvotes: 3

Jesús Carrera

Reputation: 11425

Since you are using Android < 5.0 you can't use the default adb reverse method, but Facebook has added official documentation to connect to the development server via Wi-Fi, which would support your version. Quoting the instructions for MacOS, but they also have them for Linux and Windows:

Method 2: Connect via Wi-Fi

You can also connect to the development server over Wi-Fi. You'll first need to install the app on your device using a USB cable, but once that has been done you can debug wirelessly by following these instructions. You'll need your development machine's current IP address before proceeding.

You can find the IP address in System Preferences → Network.

Make sure your laptop and your phone are on the same Wi-Fi network. Open your React Native app on your device. You'll see a red screen with an error. This is OK. The following steps will fix that. Open the in-app Developer menu. Go to Dev Settings → Debug server host for device. Type in your machine's IP address and the port of the local dev server (e.g. 10.0.1.1:8081). Go back to the Developer menu and select Reload JS.

Upvotes: 3

Anthony Naddeo

Reputation: 2751

I ended up having to open up the port that I was using (8081 by default). On Linux, you can do the following

sudo iptables -A INPUT -p tcp --dport 8081 -m conntrack --ctstate NEW,ESTABLISHED -j ACCEPT
sudo iptables -A OUTPUT -p tcp --sport 8081 -m conntrack --ctstate ESTABLISHED -j ACCEPT

You can test to see whether you actually need to do this. Just navigate to your dev server in Chrome on your Android device. If it doesn't respond, then this might be what you need. If it does respond, then this won't help you.

Upvotes: 1

h--n

Reputation: 6023

For me, it's because adb was not in the PATH. It's located /Users/man/Library/Android/sdk/platform-tools for me, it may be somewhere else for you, but anyway, find it and add it to your path to see if that help.

Upvotes: 3

Mike Yang

Reputation: 2944

restart the genymotion
run react-native run-android
the problem was solved

Upvotes: 5

lee_dabiker

Reputation: 13

For me, I had side-sync enabled and active. Closing it imediately made the issue go away. It might be worth closing this or any other communication between PC and device

Upvotes: 1

error &quot;Could not get BatchedBridge, make sure your bundle is packaged properly&quot; on start of app

Answers (30)

Related Questions

error "Could not get BatchedBridge, make sure your bundle is packaged properly" on start of app