React-natve,windows System Configuration (fix most bugs)

Outside: Recently addicted to mobile phone development, for JS call native quite interested, experience Apache Cordova, and react-native aroused interest in Facebook, so the configuration process, because the configuration is really a problem, people are miserable, I hope my experience will help you a little.

Begin:

First, install the latest node

Official website: https://nodejs.org/en/

Second, install the Android SDK, and configure the environment variables .

A little process, Baidu is all, random search, the necessary SDK, version of their own matching.

Third, start configuration react-native

cmd Command window to run:

npm install -g react-native-cli

Just wait for it to finish.

After the installation is complete, you can create a react-native project.

react-native init Test

Test is the project name, and the path where the command window is located is the project path. I used to put it on the root directory
So where the project is (D: / Test)
It takes a long time. Hundreds of MB of files.
(PS: The installation failed during the process. If the installation fails repeatedly, restart the computer and try again)

At this time we enter:

cd Test

Enter the project path, pause here, use the simulator.
Four, simulator debugging

Use the officially recommended Menymotion emulator here

Official website: https://www.genymotion.com/download

PS: You need to register an account to download and log in after installation.

Select 143.44mb to download and install.

+ Add Add an emulator.

Choose the emulator that matches your version. start up

OK

At this time, open a new cmd command window to run the js server required by react-native

cd into the project path, enter:

react-native start

No need to turn off, just wait for the start to complete

Back to the previous cmd command window, enter:

react-native run-android

It will automatically run on the emulator. If it is not running Enter: (adb devices) Check if there is a device.

 

5. Simulator operation

At this time the screen is red, don't be afraid, normal.

First turn on the wifi of the emulator and connect it.

Then press menu and select Dev Settings

Click Debugger server host & port for device

Enter the IP of your PC, for example: 192.168.X.X: 8081

PS: Be sure to enter the port number!

ok! Then click back, press menu and click reload js to start loading.

PS: Here we should pay attention to the command window of the js server, which shows the installation progress. If the installation fails to 99% error, please delete the .babelrc file under the path according to the error path prompt and click reload js.

OK! After that, you can refer to the official demo for development and testing.

react-natve, configuration under Windows system (solve most of the BUG)