配置React Native 安卓开发环境

配置主要分为以下几步：

1. 安装node.js
2. 安装AndroidStudio
3. 安装React Native命令行工具
4. 搭建React Native版本的Hello World，修改代码查看效果

第一步

下载node.js，安装并配置环境变量。下载地址：https://nodejs.org/en/download/。

检验是否配置成功，命令行输入：node -v

成功则会显示nodejs版本，否则配置有问题。

第二步

安装AndroidStudio。下载地址：https://developer.android.google.cn/studio/。

安装完成后在设置中选择需要的SDK以及安装位置。

SDKPlatforms中选择准备开发的安卓版本。

SDKTools中选择需要的工具。值得一提的是，之后运行虚拟机可能会报关于HAXM的错（File Not Found），其中一个原因就是没安装Intel x86 Emulator Accelerator工具，另一个原因可能是系统未开启cpu加速，需要在bios中设置开启VT-x。当然还有可能是cpu太老不支持，可以进入目录：%前面配置的SDK安装位置%\extras\intel\Hardware_Accelerated_Execution_Manager中找到haxm_check.exe的文件，用命令行打开，检查系统是否支持该功能。

安装完成后配置环境变量，添加ANDROID_HOME = %前面配置的SDK安装位置%，path加上%ANDROID_HOME%\tools;%ANDROID_HOME%\platform-tools;

在AS菜单栏中找到AVD Manager，打开配置虚拟机，记得下载选择的系统镜像。

AS默认将虚拟机放在C:\Users\Administrator\.Android中，占用大量c盘空间。于是可以修改放置位置。添加ANDROID_SDK_HOME=%目标路径%，将%ANDROID_SDK_HOME%放入path，并将.Android文件夹整个移动到目标路径下，重启AS即可。

第三步

在命令行输入：npm install -g react-native-cli

安装成功后输入react-native -v 可查看React Native版本号

第四步

在命令行中移动到计划添加React Native工程的文件夹，输入：react-native init HelloWorld。官网：https://facebook.github.io/react-native/docs/getting-started.html。

创建完成后输入：react-native run-android，安卓将直接将app安装到打开的虚拟机，若有硬件连接则优先安装到硬件，这个安装和配置过程会持续一段时间。

完成后在屏幕上会看到欢迎界面。此时修改工程目录下App.js文件，比如向render方法中添加一行。安卓在虚拟机中双击r刷新查看效果。可随意修改代码以查看各模块功能。

<Text style={{
    flex:1,
    top:20,
    left:50,
    fontSize:18
}}>HELLO WORLD</Text>

Facebook提供详细的React Native帮助文档，地址：https://facebook.github.io/react-native/docs/tutorial。

ps: android_studio 更新gradle有时候特别慢，还容易中断，导致工程初始化失败。这种情况下可以自己从官网下载gradle手动配置。官网：https://services.gradle.org/distributions/。

在项目目录下寻找gradle/wrapper/gradle-wrapper.properties，确认里面distributionUrl中版本号与手动下载的版本号匹配。之后将下载好的压缩包放入AS默认地址：

C:\Users\YOURUSERNAME\.gradle\wrapper\dists\gradle-4.4-all\9br9xq1tocpiv8o6njlyu5op1

其中本例使用gradle4.4，后面一串码是AS自动生成的（需要先在AS中点击“Sync Project with Gradle Files”图标，待生成文件夹后关闭AS进行手动配置）

现在重启AS，再次点击“Sync Project with Gradle Files”图标，成功更新。

参考：http://www.jianshu.com/p/e887203e30f6

**使用旧版Navigator组件

　　npm install -g yarn react-native-cli

　　yarn add react-native-deprecated-custom-components

**设置国内镜像

　　yarn config set registry https://registry.npm.taobao.org --global

　　yarn config set disturl https://npm.taobao.org/dist --global

**2019RN官网开始使用Expo生成与管理RN项目，Expo链接：https://expo.io/learn

第三步：npm install expo-cli --global

第四步：

　　expo init my-project

　　cd my-project

　　expo start