在Windows下搭建React Native Android开发环境

在Windows下搭建React Native Android开发环境

一、安装JDK

从Java官网下载JDK并安装。请注意选择x86还是x64版本。
将JDK的bin目录加入系统PATH环境变量。

二、安装Android SDK

可以单独安装Android SDK，也可以通过Eclipse ADT或者Android Studio一并安装。推荐使用Android Studio，以下说明会默认以Android Studio的方式说明。请注意选择x86还是x64版本。
为了加速下载，推荐从AndroidDevTools下载。
然后进入SDKManager(可通过Android Studio菜单Tools-Android-SDK Manager)，确保以下项目已经安装并更新到最新：
Tools/Android SDK Tools (24.3.3)
Tools/Android SDK Platform-tools (22)
Tools/Android SDK Build-tools (23.0.1)
Android 6.0 (API 23)/SDK Platform (1)
Extras/Android Support Library(23.0.1)
推荐使用腾讯Bugly的镜像加速下载。将SDK的platform-tools子目录加入系统PATH环境变量。

三、安装C++环境

推荐从itellyou下载并安装Visual Studio 2013或2015。也可选择Windows SDK、cygwin或mingw等其他C++环境。编译node.js的C++模块时需要用到。

四、安装node.js

直接去nodejs的官网http://nodejs.org/上下载nodejs安装程序，双击安装就可以了
测试安装是否成功：
在命令行输入 node –v 应该可以查看到当前安装的nodejs版本号

五、安装npm

a) 如果系统没有安装过Git，可以直接到
https://github.com/isaacs/npm下载npm所需要的文件。
b) 如果有Git 可以使用git下载。
git clone --recursive git://github.com/isaacs/npm.git
下载到npm文件后，命令行首先转到npm所在目录下，输入以下代码进行安装。
node cli.js install npm -gf
六、安装Github 客户端
安装教程见http://jingyan.baidu.com/article/75ab0bcbc8492dd6864db2fa.html
安装完成后将Git客户端的\Git\cmd目录加入系统PATH环境变量（如D:\Program Files\Git\cmd）
七、安装react-native命令行工具

官方的安装方法是
npm install -g react-native-cli
但是由于npm上的版本在windows下存在BUG，因此需要安装github上的master支线，否则会在下一步骤报以下错误：

This will walk you through creating a new React Native project in *** events.js:141       throw er; 
// Unhandled 'error' event       ^ Error: spawn npm ENOENT     at exports._errnoException (util.js:837:11)     
at Process.ChildProcess._handle.onexit (internal/child_process.js:178:32)     
at onErrorNT (internal/child_process.js:344:16)     
at doNTCallback2 (node.js:429:9)     
at process._tickCallback (node.js:343:17)     
at Function.Module.runMain (module.js:477:11)     
at startup (node.js:117:18)     
at node.js:951:3

如果您看到本文时0.12已经发布，那很可能直接输入上面的命令就行了。如果0.12还没有发布，请进行以下步骤：
在React Native的Github页面右侧点击Download ZIP，下载后解压，并在react-native-cli目录下执行以下代码：
npm install -g

八、创建项目

进入你的工作目录，运行
react-native init MyProject
并耐心等待数分钟。（具体时间看人品）

九、运行packager

如果你有cygwin，可以在cygwin环境中进入工程目录，运行
npm start
如果没有cygwin或不在cygwin环境中，可以进入工程目录，运行
node node_modules\react-native\packager\packager.js
可以用浏览器访问http://localhost:8081/index.android.bundle?platform=android看看是否可以看到打包后的脚本。第一次访问通常需要十几秒，并且在packager的命令行可以看到进度条。

十、安卓运行

推荐使用真机测试，要配置好驱动（可以使用360手机助手或者应用宝来安装驱动），使得
adb devices
可以看到对应的设备。

保持packager开启，另外打开一个命令行窗口，然后在工程目录下运行
react-native run-android
首次运行需要等待数分钟并从网上下载gradle依赖。
运行完毕后可以在模拟器或真机上看到应用自动启动了。

如果gradle依赖下载出现报错，请多试几次，或者设置VPN加速。
（我上传了64位版本的.gradle.rar文件，下载并解压后放置在C:\Users\“用户名” 目录下，之后重新执行命令react-native run-android）
如果apk安装运行出现报错，请检查platform-tools是否已经设到了PATH环境变量中，运行adb devices能否看到设备。

至此，应该能看到APP运行，并报错 Unable to download JS bundle
摇晃设备或按Menu键（Bluestacks模拟器按键盘上的菜单键，通常在右Ctrl的左边 或者左Windows键旁边），可以打开调试菜单，点击Dev Settings，选Debug server host for device，输入你的局域网IP，再按back键返回，再按Menu键，在调试菜单中选择Reload JS，就应该可以看到运行的结果了。

参考博客：
http://my.oschina.net/jackzlz/blog/508210
http://blog.csdn.net/haidaochen/article/details/7257655