Windows Builds react-native development environment

Source: Internet
Author: User

First, the target platform windows+android

1. Required Software




2. Install the react-native command line

      $ NPM install-g react-native-cli

3. Build an Android environment

(1) React native currently requires Android Studio2.0 or later, Android Studio requires Java development Kit [JDK] 8 (note that later versions are not supported)

(2) official web download Android studio, JDK Select Jdk-8u161-windows-x64.exe, the JDK has been upgraded to 10, remember that you can not choose more than 8 version

(3) The operation of the project requires an Android phone or simulator (self-Baidu, installation needs a large space)

(4) After the initial installation, you canSelect Custom path and components (all components are recommended to install to the D drive directory)


(5) Installation complete Open as welcome to the lower right corner select Configure | SDK Manager


In the SDK Platforms window, select Show Package Details , and then tick in,, Android 6.0 (Marshmallow) Google APIs Android SDK Platform 23 Intel x86 Atom System Image , Intel x86 Atom_64 System Image and Google APIs Intel x86 Atom_64 System Image . (Different devices may require the SDK Platfrom version is not the same, wait until the last time the error prompt to come back to install it)


In the SDK Tools window, select and Show Package Details then tick in Android SDK Build Tools Android SDK Build-Tools 23.0.1 (must contain this version.) Of course, if other plugins need other versions, you can install more than one version at a time. Then check the bottom of the box Android Support Repository .


(6) Configure environment variables in two steps ( not less )

First, add the path to the SDK

Advanced system Settings > Advanced > Environment variables (System variables s) > New >

Variable name: android_home

Variable Value: D:\USERS\ADMINISTRATOR\APPDATA\LOCAL\ANDROID\SDK (actual Sdk download location)

Second, add jdk8,platform-tools,tools environment variable path, (here is installed to the D disk, the actual situation depends on the installation directory)

            D:\Program Files\java\jdk1.8.0_161\bin



Third, check whether the JDK installation was successful: $ javac-version

(7) Connect the phone

Open the Phone developer options: Settings More Settings "about mobile" software version number more than 7 consecutive clicks can open "developer Choice"

Turn on the phone USB debug: Settings More Settings developer options (generally at the bottom) developer options open, USB debug on

Phone connected to the computer: Automatic installation of drivers, such as failure, it is recommended to download mobile phone assistant or pea pod when connected to a mobile phone will install the driver, here use the Computer Butler tool to install the connection

          Note: The first time the phone connected to the computer, the mobile phone first page will pop up the Debug dialog box, you need to determine the computer can be connected, such as missed tips, can be repeatedly connected to the phone



Last: Open the command line tool to detect if the phone is connected successfully to ADB devices, display the devices serial number as the connection is successful


(8) Building the project

1. Initialize and install dependencies, such as relying on incomplete installation, first remove node_modules after the root directory re-cnpm install


2. Start the project

$ react-native Run Android (first run required download Gradle dependency, decimal point indicates download progress, determined by network quality speed)




Download to the end of the New Nodejs Server window (this window opens a server environment for the project, which can be run on localhost:8081), the app is automatically opened on the phone


Apps on the phone


4. Finally, use the development tool (as or webstorm), modify the code on the App.js, touch the menu key in the bottom left corner of the phone, click Reload to update the changes







Windows Builds react-native development environment

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.