ReferenceError: Can't find variable: __fbBatchedBridge - node.js

Question

Using just the default code from react-native init AwesomeProject, when I run the app I get the 'ReferenceError: Can't find variable: __fbBatchedBridge (line 1 in the generated bundle)'.
And, when I 'Reload JS', the app just has the white background rather than any 'hello world' views. I haven't touched any of the code from the init.
Any ideas how to resolve the error?
Screenshot (click to view full size):
Using:
Ubuntu 15.10, 64-bit
Node.js v5.3.0
reactive-native v0.1.7
Nexus 5X, API 6.0.1

Answer 1

I generally see this when the packager hasn't started. Ensure that is running by running react-native start

Answer 2

I had the same issue while using Visual Studio Android Emulator. When the red screen shows up type in the command line
adb shell input keyevent 82
This will trigger the shake event and launch the dev menu
Then hit Dev Settings > Debug server host & port for device and enter <your ip adress>:8081. If for some reason you cannot type in the field you can trigger the text action in the command line by using
adb shell input text <your ip adress>:8081

Answer 3

i solved it using this command
adb reverse tcp:8081 tcp:8081

Answer 4

Thank you rmevans9 and Anonsage for your answers!
I am using HTC One on Ubuntu and there is no menu option, anyway this is the summary of the answers that worked for me:
Create the project
$ react-native init MyProject
$ cd MyProject/
In first console tab run and leave it running as you develop (react-native start alternative):
$ npm start
In second console tab compile and install the project (connect the device to the USB if you want):
$ react-native run-android
Fix ReferenceError: Can't find variable: __fbBatchedBridge:
Find you local ip address by executing ifconfig on Linux/Mac, for example:
inet addr:192.168.0.3
Shake the device to see menu options while app is running (if you don't have "Menu" button)
Go to Dev Settings -> Debug server host & port for device in Debugging section and copy your local ip address with the specific port:
192.168.0.3:8081 (the port can be viewed when running npm start from the first tab)
then go/press Back
Shake the device to see menu options again and press Enable Live Reload (to see changes live when editing)
Shake the device to see menu options again and press Reload JS

Answer 5

This worked for me according to documentation
http://facebook.github.io/react-native/docs/running-on-device-android.html#content
Using adb reverse
Note that this option is available on devices running android 5.0+ (API 21).
Have your device connected via USB with debugging enabled (see paragraph above on how to enable USB debugging on your device).
Run adb reverse tcp:8081 tcp:8081
You can use Reload JS and other development options with no extra configuration
Then Run react-native run-android which will automatically start dev server on 8081 port on your dev machine if not already running.

Answer 6

I encountered this when I had specified different react native versions in my packages.json and my build.gradle file. Making sure they matched, running npm update, and rebuilding from android studio fixed the issue for me.

Answer 7

I had the same problem.
As I followed all the steps mentioned in other answers, I could not resolve the issue.
In my case the firewall was blocking the packets coming from android.

Answer 8

Also If you have submitted your app for the iTunes store, also make sure that your jsCodeLocation is back to the localhost, as shown bellow:
jsCodeLocation = [NSURL URLWithString:#"http://localhost:8081/index.ios.bundle?platform=ios&dev=true"];
/**
* OPTION 2
* Load from pre-bundled file on disk. The static bundle is automatically
* generated by "Bundle React Native code and images" build step.
*/
//jsCodeLocation = [[NSBundle mainBundle] URLForResource:#"main" withExtension:#"jsbundle"];