Windows 7 under React native environment configuration

Source: Internet
Author: User
Tags android sdk manager

React Native is a technology in the Java language that can be used to write ios,android at the same time and in the background, and it can be hot-updated in real time. FaceBook also claims that the technology is "learn Once,write AnyWhere", with only one cost of learning, while the integration of all development roles has been achieved.

This means that:

1.app will be as hot as Web page updates, ready to publish.

2. For a developer, there will be no front end, terminal, the background of the distinction, his concern is to do a complete set of applications, manpower will be the most substantial integration and release.

3. Code reuse will be the main theme, because it is a language, the cost of repeating the wheel will be more and more savings.

At present, React Native also has some shortcomings, such as his SDK package size is relatively large, crash is more, the content supported on iOS is quite good, Android is still in the initial stage.

In order to learn react Native, some people suggest to buy a Mac, can have no money! You can only configure the environment on Windows to feel it.

1 , installation Java

It is important to note the setting of the environment variable, which can be detected according to Java-version.

Set the environment variable java_home, or you may be able to report a failure to find Tool.jar when compiling later.

Add%java_home%/bin in path as shown in:

2 , installation, and configuration SDK

Here you need to be aware of setting environment variables Android_home:android SDK Manager location

For example: (android_home=> D:\Android\sdk) set the environment variable path: For example: (path=>%android_home%\tools;%android_home%\ Platform-tools)

    • Open Android SDK Manager.
    • Select the following items:
    • Android SDK build-tools Version 23.0.1
    • Android 6.0 (API 23)
    • Android Support Repository
    • Local Maven repository for support Libraries

4 , installation node

Want to be react native run up need to install node, if you do not have node. js installed, first to install node. JS on the official website, you can node-v the command to test the success of Nodejs installation

5 , installation git

Installing react-native requires git, and if you don't have git configured, you need to download the corresponding client and then add git to the PATH environment variable.

6 , installation react-native command-line tools react-native-cli

After the GIT configuration can clone react-native-cli, we recommend you to the REACT-NATIVE-CLI clone to a disk, do not directly clone in the C disk

1) in the command line, enter the directory where you want the react-native installed

2) Enter Git clone https://github.com/facebook/react-native.git and wait for the download.

The download of resources from abroad, may be due to the wall and failed, so sometimes need to download FQ.

3) Enter the REACT-NATIVE-CLI directory under the React-native directory in the directory you just entered, and type NPM install-g

7 , creating React Native Project

After entering the directory where the project was created, enter React-native init awesomeproject, waiting for a period of time (slower)

After successful, the directory structure is as follows:

7 , running service-side services

In the command line, enter the project directory, type react-native start, and wait a while. After successful startup, the http://localhost:8081/index.android.bundle?platform=android can be accessed with a browser, which indicates that the server-side start succeeds if it can be accessed.

7 , run the project

Just run the service side of the command line do not close, restart a new command line,

Go to project directory, enter React-native run-android launch Android Project

Before this command, make sure that the Android emulator is configured and started.

You can use the command ADB devices to view the list of currently available devices

Wait for the run (if it is the first run, the Gradle will be downloaded first, the time is longer)

In general, when the first deployment, because the IP address and port number is configured correctly, there will be errors, the simulator can use Ctrl+m (menu) to bring up the dev setting menu

Real device Shake your phone, click Dev Settings, click Debug Server Host & port for device, set IP and ports. The IP address here is the IP of the computer.

用react-native start --port 9988 可以修改默认的8081端口

Windows 7 under React native environment configuration

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: info-contact@alibabacloud.com 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.