I was at Hack Night Session and trying to run React Native Hello World App on my friend’s Android Device. Installation of React Native modules are simple. First you will need to install Nodejs and Python2 on your PC as said in React Native documents. So after running below command you will have React Native Client installed.
|
1 |
npm install -g react-native-cli |
As instruction say you will need to download Android SDK (installing JDK before would be nice) and make sure have Android Build version 23.0.1 installed. If not can do this from AVD.
After all requirements are installed, instruction say to run below commands.
|
1 2 3 |
react-native init AwesomeProject cd AwesomeProject react-native run-android |
If you run it on Android Device you probably will get below error.
adb reverse tcp:8081 tcp:8081 error closed
In the React Native documents, it say to execute below command for android device to connect to Packager server (React Native Debug Server).
|
1 |
adb reverse tcp:8081 tcp:8081 |
Unfortunately this will only work with android version 5.0+ so if you try this below v5.0 will get error from adb. Below is the step I took to start the android app from windows 10.
Run command line as administrator and start the Packager. (Make sure you are on the project directory.)
|
1 |
react-native start |
On the different command line go to your project directory and execute below command.
|
1 |
curl "http://localhost:8081/index.android.bundle?platform=android" -o "android/app/src/main/assets/index.android.bundle" |
If you get error, probably need to create the directory for copying the file from the Packager.
|
1 |
yourProject/android/app/src/main$ mkdir assets |
Run the curl command again and should be able to download the file from running Packager. After the download, run the build command for React Native App.
|
1 |
react-native run-android |
Next thing you will encounter is error message stating app could not connect to development server from application screen. Since the android device is not connect by adb reverse, it can not see the debug server running on your local PC (http://localhost:8081). At this point you should have http://localhost:8081/debugger-ui open on your browser and have dev tool console line open to check if there are connection.
From here follow the document about connecting to development server via wifi. After the setup, from the development menu on your app, select Debug JS Remotely and you should see the connection success on browser dev tool console. Always make sure PC and android device are on same wifi network (same SSID).
This is just a not when working inside native android code. When running build command will encounter build error many times, but turning off the Packager during the build process and on again when app is installed works (I assume it is not a best way but it just does somehow).