react native windows configuration environment from scratch
react native is a native mobile application written using JavaScript and React
React Native enables you to write native mobile applications using only JavaScript. It is consistent with React in terms of design principles, and uses a declarative component mechanism to build a colorful user interface.
Let's build the environment required by react native
Set up the environment
Installation dependencies
The dependencies that must be installed are:
Nodejs, React Native command line tools, JDK and Android Studio.
Although you can use any editor to develop applications (write js code, here is vscode), but you still have to install Android Studio to get the tools and environment needed to compile Android applications.
nodejs installation URL
http://nodejs.cn/
After installation, open the command line to install yarn reactNative
npm install -g yarn react-native-cli
Install Taobao mirror
yarn config set registry https://registry.npm.taobao.org --global
yarn config set disturl https://npm.taobao.org/dist --global
yarn replaces the npm tool, which can speed up the download of node modules
yarn代替npm install命令，用yarn add 某第三方库名代替npm install 某第三方库名
Android development environment
Install javaJDK, JRE
1. Download and install java & jdk
https://www.java.com/zh_CN/
https://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html
Configure environment variables
Create a new JAVA_HOME variable.
The variable value fills in the jdk installation directory (I am E:\Java\jdk1.7.0)
Path variable → edit
Enter %JAVA_HOME%\bin;%JAVA_HOME%\jre\bin; at the end of the variable value;
(Pay attention to whether there is a; number at the end of the variable value of the original Path. If not, enter the number first and then enter the code above)
New CLASSPATH variable
Fill in the variable value.;%JAVA_HOME%\lib;%JAVA_HOME%\lib\tools.jar (note that there is a point at the front)
Install Android Studio
[首先下载和安装 Android Studio](http://www.android-studio.org/)
安装之后下载组件
选择configure ->SDK Manager
Select the "SDK Platforms" tab in the SDK Manager, and then check "Show Package Details" in the lower right corner. Expand the Android 9 (Pie) option and make sure the following components are checked (reiterate that you must use a stable circumvention tool, otherwise you may not see this interface):
-
Android SDK Platform 28
-
Intel x86 Atom_64 System Image (the official emulator image file, you do not need to install this component when using the unofficial emulator)
and then click the "SDK Tools" tab, and also check the "Show Package Details" in the lower right corner. Expand the "Android SDK Build-Tools" option and make sure to select the 28.0.3 version required by React Native. You can install multiple other versions at the same time.
After installation, configure the android environment variable and
open the Control Panel -> System and Security -> System -> Advanced System Settings -> Advanced -> Environment Variables -> New, create an environment variable named ANDROID_HOME (system or user variables are both) , Point to the directory where your Android SDK is located (the specific path may be inconsistent with the figure below, please confirm by yourself): The
SDK is installed in the following directory by default:c:\Users\你的用户名\AppData\Local\Android\Sdk
You can view the real path of the SDK in the "Preferences" menu of Android Studio, specifically Appearance & Behavior → System Settings → Android SDK.
- Add the platform-tools directory to the environment variable Path
Open the Control Panel -> System and Security -> System -> Advanced System Settings -> Advanced -> Environment Variables, select the Path variable, and click Edit. Click New and add the path to the platform-tools directory.
The default path of this directory is:
c:\Users\你的用户名\AppData\Local\Android\Sdk\platform-tools