React Native Environment configuration
The most full Windows version ever installed react native environment configuration
Configured over React Native environment are aware that in the Windows React Native environment configuration has a lot of pits to jump, in order to help newbies quickly and correctly set up the environment of this site to build a tutorial.
Installation learning encounters any problems you can join Reactnative Advanced AC Group 127482131 or visit http://blog.1ygowu.com reactnative technical topics
The first step is to install the Java JDK
- Download the 1.8 32-bit or 64-bit SDK that corresponds to your computer system version.
- Download website http://jdk.android-studio.org/
- Test Path Environment cmd command line input Java content after installation is complete
Second step to install Android environment
- Http://tools.android-studio.org/index.php/sdk
- Install installer_r24.3.4-windows.exe after download, interface appears after successful installation, select SDK Manager to open
- Install the following package, all must be installed if the site is wall can set mirror site
- In particular, Intel x86 Emulator HAXM install needs to be installed on its own and enabled in the BIOS to support Intel Virtualization technology
- If the download is slow, you can set the mirror
- Launch Android SDK Manager, open the main interface, select "tools", "options...", pop up the "Android SDK manager-settings" window;
- In the "Android SDK manager-settings" window, fill in and in the "http proxy server" and "http proxy port" input
mirrors.neusoft.edu.cn
boxes 80
, and select "force https://... sour Ces to is fetched using http://..."check box. Click the "close" button to close the "Android SDK manager-settings" window and return to the main screen after Setup is complete.
- Select "packages", "reload".
Step three Android environment settings 1. Find My Computer-Properties-Advanced system Settings-advanced-environment variable new ANDROID_HOMN value phenomenon you installed the SKD directory such as: D:\Program Files (x86) \ANDROID\ANDROID-SDK 2. Path adds the following content%android_home%;%android_home%\platforms;%android_home%\platform-tools;%android_home%\tools; Test whether the configuration is successful, open command line input Android and ADB test must be successful, the next to correctly compile the project fourth step other environment configuration recommended installation on Python 2.7, some may not install or nothing https://www.python.org/down loads/Install git install react-native need git, if you do not configure git, you need to download the corresponding client: https://git-for-windows.github.io/Fifth step RN environment setting and building
- Download stable version Nodejs v5.7.0 Stable
Download website https://nodejs.org/en/
- Post-installation command line input NPM test success
Because of well-known network reasons, the React-native command line will be in trouble when dragging code from NPM official source. Please replace the NPM repository source with a domestic mirror:
npm config set registry https://registry.npm.taobao.orgnpm config set disturl https://npm.taobao.org/dist
NPM install-g react-native-cli After installation, you can have the react-native command on the command line to create the RN Project command line into the directory entry where you want to create the project
react-native init AwesomeProject
It's probably going to be slow, and so on, about 200 m file Enter the project directory on the command line, enter react-native start, wait some time: some people error need to delete the following file (self-backup) d:\ Program files\reactnative\myproject\node_modules\react-deep-force-update\.babelrc can now use a browser to access HTTP.// localhost:8081/index.android.bundle?platform=android if the above script contents indicate that the server side is ready. Sixth step configuration Android simulator Note Essentials Memory settings 515 turn on the GPU configuration and start the emulator if you can't use genymotion, Recommended to use the Genymotion simulator than Google's simulator to install Genymotion-2.6.0-vbox may want to go to the official website to register an account official website download https://www.genymotion.com/Download Network/HTTP pan.baidu.com/s/1bntnxs7 installation needs to be configured under, here pit me for a long time, run-android can not find the device will need to set this genymotion not network configuration problems, online find a lot of tutorials can not be used, Later on self-study the following solutions Local Area Connection-properties-sharing-Set the following view shared IP settings will be used to modify the Oracle VM VirtualBox configuration Nic 1 NIC 2 configuration Configure IP Management Global Settings double-click VirtualBox Host-onley Ethernet adapter The last step, is also the most important step to open the simulator WiFi, or the subsequent project error. show no network, but actually available connection network test service port IP for your native IP ipconfig view local connection IPv4 address Seventh step Compile code package to emulator CD to project file directory using react-native Run-android &nBSP; wait to run (if it is first run, first download gradle, longer) successful interface First run will appear, this time we shake the phone, click Dev Settings, Click Debug Server Host & port for device, set IP and Ports IP here is your local computer's IPv4 IP, do not know the command line can be entered ipconfig to query, Port number fixed 8081 set, back to the blank page, shake the phone again, choose Reload JS, the program runs up, appear welcome to React native! completed if you install learning encounter any problems can join Reactnative Advanced AC Group 127482131 or access http://blog.1ygowu.com Reactnative Technical Topics
React Native Environment configuration