React-native: Android error “Could not get BatchedBridge, make sure your bundle is packaged properly” on start of app

[Zygro]

Solution

Run the following:

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

---

Description

After creating a project and not changing a single file, I tried to test it on my 4.4.2. device. I got this red screen right on start of the app and after dismissing it, only white screen was shown instead of welcome message that was supposed to be there.

I also got this error on 5.1.1, but the project worked fine on 6.1.1.
Android emulator (for 4.4.2) was also able to display the messages without this redscreen

Edit: On Stack Overflow, user tbo has posted an answer with a workaround. It does work, however it's not ideal as it takes more time http://stackoverflow.com/questions/38870710/error-could-not-get-batchedbridge-make-sure-your-bundle-is-packaged-properly/38874952#38874952

[jacobp100]

I get a similar error when trying to run an iOS app using a local build (no dev server): _fbBatchedBridge is undefined. The documentation on running on the device seems to be out of date too.

[krtr]

Sometimes I got this error when I start clean app (bundle was never downloaded) In most cases there is error in connection between phone and computer.
Checking:

• if adb reverse proxy is set up
• if packager fucked up
• if server adress is good (dev settings)

does a thing
(solution in SO does work because you upload prebacked apk with bundle inside but idk if watch works for you)

[brkr]

I got same error both android device and emulator

[etroynov]

it helps to me:
http://stackoverflow.com/questions/38870710/error-could-not-get-batchedbridge-make-sure-your-bundle-is-packaged-properly

[fisherman818]

@T0toro facing the same error, but the info at the link doesn't help me

[st0ffern]

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

[fisherman818]

Found the solution:
react-native start
then reload the app.

[laszl0]

I got it to work by changing in the file .buckconfig the line:
target = Google Inc.:Google APIs:23
to
target = Google Inc.:Google APIs:24

Edited:
I was having the same exception on the device Z3 Compact D5803 - 6.0.1
Then i saw in SDK Manager that Android 6.X has api level 24 and not 23, then i changed.

[st0ffern]

@fisherman818 as i said..
@laszl0 should not be a issue. RN is not dependent on API 24

[fisherman818]

@stoffern yes, you are right. thanks

[laurakelly]

This solution on Stack Overflow worked for me: http://stackoverflow.com/a/38874952/1880100

I am only seeing this issue on my 6.0.0 emulator, but not my 4.4.4 emulator

[Mahluleli-Goodson]

If this is happening on physical device, do adb reverse tcp:8081 tcp:8081, then reload your app
Hope it helps!!

[calcyu]

可以看下这个
http://www.geek5.cn/?p=232

[Antibioticvz]

Anyone found the solution? (tried all here... )
I have this problem only for android 5.1

[chespinoza]

I had the same problem with a clean installation, and I solved it with http://stackoverflow.com/questions/38870710/error-could-not-get-batchedbridge-make-sure-your-bundle-is-packaged-properly

I think this should be documented.

[diegoarcega]

I had the same issue.

I first needed to run the server
react-native start

and then
react-native run-android

[sergionsz]

react-native start tells you what's wrong. In my case, there were other processes listening on port 8081. Solved it by getting them:

lsof -n -i4TCP:8081

and then killing them'all.

[changkun]

any feasible solution?

react-native start && react-native run-android is not working for me.

[Antibioticvz]

@changkun Try to change an emulator device

[changkun]

@Antibioticvz cool! It works for me, just simply change the emulator from nexus5 to nexus 6.

[Antibioticvz]

@changkun what the emulator do you use? I've got this problem for Genymotion -> nexus 5 (5.0.0 api21)

[changkun]

@Antibioticvz I was using Genymotion Nexus 5 (6.0.0, API 23), then I followed your suggestion change to Nexus 6 (6.0.0, API 23) everthing works fine.

However, now this error happens again... even to use the nexus 6 emulator...

[flexdhana]

This issue is frustrating me.. i tried in all the devices with Android 4.4, 5.0.1, 6.0.. and getting the same issue "could not get batchedbridge make sure your bundle is packaged correctly".. . please help me to fix.. its working fine in emulator, issue only on actual device.

I am using:
React Native
Android Studio
Android device (4.4, 5.0.1, 6.0)

[etroynov]

For physical device in helps to me (in console):
adb reverse tcp:8081 tcp:8081

Environment:

• Ubuntu 15.10
• Android studio 2.1.3
• HTC Desire 626G ( Android 6.0.1 )

p.s app build with android studio

[sumit6b]

This is happening on both of my emulator and mobile device, and none of the solutions working for me, sadly.

[hari2babloo]

Same Here

[sumit6b]

So I dig a little bit more and found that my <root>/android/app/build/intermediates/assets/debugfolder was empty and by running cd android && ./gradlew assembleDebug was not creating those files required, which are later used by javascript thread in our react native apps.

I ran manually the following command which the debug build command should have created ideally.

node node_modules/react-native/local-cli/cli.js bundle --platform android --dev true --reset-cache --entry-file index.android.js --bundle-output /<path to dir>/android/app/build/intermediates/assets/debug/index.android.bundle --assets-dest /<path to dir>/android/app/build/intermediates/res/merged/debug

After running these commands I found two bundle files in my <root>/android/app/build/intermediates/assets/debug

And then a I ran again cd android && ./gradlew installDebug my app started working again.

[manavdahra]

@sumit6b Thanks, your solutions works for me.

[arhmnsh]

This issue also happens if your device is not on the same network as your dev machine.

[liubobuzhidao]

I created a demo program，and run it on samsung 5.0 successfully, but failed to run on 4.4.4，The error is same with up, I have try to all the methods provided by provider,but no effect!

[jiangqqlmj]

Android 4.4 OK
when 5.0 or 6.0 this is the same question

[liubobuzhidao]

However,I'm always wrong when running on android 4.4 ,but it's ok on api 21 +.

Update:I know the reason why I can't get the result what I want, You should check your phone first whether opened the Suspension box!

[SarjuHansaliya]

@sumit6b Thanks , Your solution worked for me but I can't use it in dev build , everytime I change something and I have to build apk.Any help on that?

[markortiz]

I'm having the same error and solve it by running solution that i found here http://stackoverflow.com/a/38874952/2840870

First I clean gradle by running

(cd android/ && gradlew clean)

Then start to bundle android by running:

node node_modules/react-native/local-cli/cli.js 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/

After that I run the script to make android build by running:

(cd android/ && gradlew assembleDebug)

And last I start to run my project by running react-native run-android
This error was solved now.

(Note: Since I'm using windows, I run this solution first on ming and the error is still exist and it does only create one bundle file under <root>/android/app/build/intermediates/assets/debug then I try to do this same solution in ming with Run as Administrator and it was able to create 2 bundle file under the same path)

(Note 2: I was able to fix this problem and display the main view of my project but still having issue on cmd which I think a separate error)

ERROR  UNKNOWN: unknown error, lstat 'c:\react-apps\qt-mobile-app\node_modules\.bin\JSONStream'
{"errno":-4094,"code":"UNKNOWN","syscall":"lstat","path":"c:\\react-apps\\qt-mobile-app\\node_modules\\.bin\\JSONStream"}
Error: UNKNOWN: unknown error, lstat 'c:\react-apps\qt-mobile-app\node_modules\.bin\JSONStream'
    at Error (native)

[ryanhomer]

Check to make sure that your MainApplication.java file does NOT have the following import:

import com.facebook.react.BuildConfig;

I inadvertently added this in error when I was changing my app's package name and somewhere along the way Android Studio complained that it could not find the class and suggested that I added it. If you do not have this, try invalidating your Android Studio cache and restarting Android Studio.

For me, this caused my app to use a release or cached version of BuildConfig which made return BuildConfig.DEBUG return false. If you leave this out, a generated version in your build folder will be used instead which, for debug builds, will return true.

Then, in DevSupportManagerFactory's create function, enableOnCreate will be true and will return a DevSupportManagerImpl class instead of a DisabledDevSupportManager class. This will cause your React Native app to access the package server instead of looking for an internal JS bundle.

public class DevSupportManagerFactory {
  ...
  public static DevSupportManager create(
    Context applicationContext,
    ReactInstanceDevCommandsHandler reactInstanceCommandsHandler,
    @Nullable String packagerPathForJSBundleName,
    boolean enableOnCreate,
    @Nullable RedBoxHandler redBoxHandler) {
    if (!enableOnCreate) {
      return new DisabledDevSupportManager();
    }
    try {
      // ProGuard is surprisingly smart in this case and will keep a class if it detects a call to
      // Class.forName() with a static string. So instead we generate a quasi-dynamic string to
      // confuse it.
      String className =
        new StringBuilder(DEVSUPPORT_IMPL_PACKAGE)
          .append(".")
          .append(DEVSUPPORT_IMPL_CLASS)
          .toString();
      Class<?> devSupportManagerClass =
        Class.forName(className);
      Constructor constructor =
        devSupportManagerClass.getConstructor(
          Context.class,
          ReactInstanceDevCommandsHandler.class,
          String.class,
          boolean.class,
          RedBoxHandler.class);
      return (DevSupportManager) constructor.newInstance(
        applicationContext,
        reactInstanceCommandsHandler,
        packagerPathForJSBundleName,
        true,
        redBoxHandler);
    } catch (Exception e) {
      throw new RuntimeException(
        "Requested enabled DevSupportManager, but DevSupportManagerImpl class was not found" +
          " or could not be created",
        e);
    }
  }
}

[ghost]

For me the problem was adb not being in my path. The Get Started page tells you to put ${ANDROID_HOME}/tools in your path, which i did but that folder does not contain the adb executable. I added ${ANDROID_HOME}/platform-tools to my path, because that folder does contain adb, and then react-native run-android worked on a device with usb.

[thiagoribeir015]

The comment from @jj199611 solved the "get BatchedBridge" problem. Added ${ANDROID_HOME}/platform-tools to my path and it's working fine now.

[shuangshan]

My case:

1. open Dev setting by type command + M
2. put 127.0.0.1:8081 in Debug server host & port

issue gone. hope help.

[LibuMathew]

@sumit6b Thanks

[megahertz]

I have had the same problem when trying to make index.js as the entry point (index.ios.js and index.android.js was just "require('./index')").

[leonarpv]

Thanks @sumit6b

[asaeed]

After being stuck on this issue for a couple hours, @sumit6b's solution finally solved it for me. But I was getting another error when i attempted to "reload" upon running react-native start. This lead me to realize that my osx firewall was on. Turning off my firewall resolved all subsequent issues with reloads.

[benny856694]

@sumit6b , thanks, really works

[bhtabor]

@sumit6b works for me too, thanks a lot!

[lhrolim]

For me, on windows, the only solution that worked, believe it or not was simply to restart the PC.

I tried @sumit6b solution, but was getting another error (unknown error without much description).

I suppose was something related to windows permissions on my scenario, but not sure.

Hope this helps somebody.

[thatsVishal]

I got it working by connecting the phone through wifi rather than USB, Instructions for connecting through wi-fi are given in this link http://facebook.github.io/react-native/docs/running-on-device.html

[CharlesKuncheria]

If you were to use the Visual Studio Team Services for CI, use the Task 'React Native Bundle android' and fill in the details as mentioned in the npm task 'bundle-android' by tbo in Stackoverflow answer (http://stackoverflow.com/questions/38870710/error-could-not-get-batchedbridge-make-sure-your-bundle-is-packaged-properly).

[GibranPolonsky]

Is a simple Configuration somebody already mentioned it here but you have to change the localhost to your server IP address if you are using a physical device in Dev Settings

Regards.

[docotronic]

In my case the problem occured because

include ':app'

in android/settings.gradle

went missing (seemingly while unlinking a native module).

[Vadorequest]

Just getting started with React-Native, I got into troubles, couldn't make anything work.

Basically, using a virtual device I couldn't get it to connect. When starting the device from android avd interface, I got bind: Transport endpoint is not connected. I still haven't figured out that part.

I went using my own Android OnePlus One, yet, troubles again. But I got it working with the following steps:

Getting started

Physical device (easier)

1. Port proxy for physical device (-d will automatically target physical device)
   adb -d reverse tcp:8081 tcp:8081

2. Start ADB server
   adb start-server

3. Run react-native server for hot reloading
   react-native start

4. Start Android app on the physical device
   react-native run-android (~30sec)

5. Shake the device and enable Hot reloading and Live Reload (useful the first time)

---

I hope it will helps some of you folks! Meanwhile, if anyone has any idea about the Transport endpoint thing, please share ;)

[nsreenath]

I got the error when running react-native run-android for the first time on a device (Moto G4 Plus, Android 7.0), when following the official getting started docs. I ran the same command again and the error is gone! The only difference was that in the first run, gradle and dependencies got downloaded.

Could it be an issue with the part of the code of react-native run-android where it downloads gradle and dependencies?

[docotronic]

For the Android Emulator:
While it appears pretty crazy it seems that if you have turned off cellular Data Status in the Android Emulator and restart the App the Conenction can not be established. After Enabling Data Connection again the Emulator is able to connect to the packager again. However this does not happen if you change the status while the App is open.
Maybe this helps someone.

[bathpp]

@sumit6b Thanks! Been stucking on this for hours until I found your solution.

[kamal333k]

I faced the same error, which I resolved by connection my phone with the development server
adb reverse tcp:8081 tcp:8081
(this works on android 5.0 and above).
for more details you can refer the docs.
https://facebook.github.io/react-native/docs/running-on-device.html

[flyfei]

1. Create the android/app/src/main/assets folder

2. run 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/ on the project root

   Then assets will generate three files index.android.bundle index.android.bundle.meta index.android.map

3. Last run project react-native run-android

Test Success Device: HUAWEI MATE 7 Android 4.4.2

[dothanhlam]

@Vadorequest solution just worked well. But I must install 'watchman' and change the target sdk to 24 (instead 23)

[psam44]

A fix is submitted in issue #12344. It should at least cover some cases (or workarounds) described here.

[thatsVishal]

Just uninstall the app and run react-native run-android it worked for me

[sibelius]

@Zygro can we close this?

[iroshanAV]

How can we run app on android v4 devices :( i'm still getting this error

[helloworldtang]

Solution:
under "react-native" directory:
after run command "./gradlew :Examples:UIExplorer:android:app:installDebug" successfully,
run commnad "./packager/packager.sh" successfuly.
then click "UIExplorer App“ in the emulator or the device

[alfonsogoberjr]

@sumit6b's solution worked for me, using Bluestacks

[pickfire]

It works after I did adb reverse tcp:8081 tcp:8081.

[siddhant91]

Hello, I am trying to run my react native app but i am not able to resolve the issue "Android error “Could not get BatchedBridge, make sure your bundle is packaged properly” on start of app" , is there any fix for it , i cannot find any solution on web either.

[siddhant91]

Hi , I also get the below error Execution failed for task ':app:processDebugResources'.

java.io.IOException: Could not delete path

Does anyone has a solution on how can i run the app on emulator ???

[siddhant91]

@sumit6b your solution worked for me, thanks a lot. But how can i also have hot reload with this, as with your solution i will have to build my app every time when i make any changes.

[markortiz]

@siddhant91 have you tried this?
https://facebook.github.io/react-native/docs/debugging.html

[rewieer]

@ryanhomer thanks i also had included that Debug thing and I could not load the developer menu anymore, that's great ! 🙌

[nik]

@ryanhomer saved my life. thanks

[Cedrigax]

@markortiz you saved my day. Thanks!!
$ adb reverse tcp:8081 tcp:8081

[ravirajn22]

Try this option if you have this problem in android emulator,

open your emulator goto more options present outside the emulator, in that select 'cellular'.
In cellular, try changing Data status (to 'Denied' or 'Home' in my case it was in 'Roaming' which was causing the problem) and reload. You could also try changing Network type and check if its working.

Note: This is just one of the possible solution which worked for me, hence try other solutions if it doesn't work.
All the best..

[yogieputra8]

@stoffern Thank you, mate. You saved my day 👍🏻.
I am successfully solved this problem using:

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

[st0ffern]

why is this still open?
@hramos agree to close it? https://github.com/facebook/react-native/issues/9336#issuecomment-239626323 😉

[xedixermawan]

this bug happen when I used RELEASE version build config. switch to DEBUG version fix this issue .

[bineeshbabu]

This works for me

1. npm cache clean --force
2. react-native start
3. react-native run-android

[JeffLoo-ong]

This might be useful for someone who is in the same situation I'm in but if you get a "watch" error after attempting to run "react-native start" take a look at the solution by @grit96 https://github.com/fbsamples/f8app/issues/55