海马玩模拟器——搭建React Native环境
Visual Studio Emulator for Android 模拟器国内这网络环境不太用,所以使用海马玩模拟器,给大家推荐一下!
下面开始配置环境:
1)下载1.8+JDK,配置JDK环境参考
http://jingyan.baidu.com/article/6dad5075d1dc40a123e36ea3.html
2)下载Android Studio
配置Android SDK环境,SDK的platform-tools、tools两个子目录加入系统PATH环境变量
C:\Users\...\Sdk\tools;C:\Users\...\Sdk\platform-tools;
注:Android SDK Build-Tools 必须是23.0.1
3)下载Python 2,配置Python环境
注:不支持Python3
4)下载NodeJs,配置NodeJS环境
注:4.1+版本
5)设置国内镜像,加速环境搭建
npm config set registry https://registry.npm.taobao.org --global
npm config set disturl https://npm.taobao.org/dist --global
6)安装React Native命令行工具
通过NodeJs自带的npm命令管理工具(react-native-cli)安装
npm install -g react-native-cli
7)工作目录下创建项目
react-native init MyProject
注:耐心等待N...分钟,一般过程会非常慢,数小时左右。失败的话,多试几次
8)安装Android模拟器
注:本人使用的是海马玩模拟器(0.10.3 beta版),adb端口为26944
9)连接安卓设备
adb connect 127.0.0.1:26944
10)工作目录下运行packager
react-native start
注:浏览器访问 http://localhost:8081/index.android.bundle?platform=android 等待N...秒看到打包后的脚本,说明服务启动成功
11)工作目录下运行安卓(Android)
react-native run-android
注:首次运行需要等待N...分钟并从网上下载gradle依赖。运行完毕后可以在模拟器看到应用已经启动。
如果apk安装运行出现报错,请仔细查看报错信息和相关环境配置是否正确。如果,看到APP红屏报错,说明环境已经搭建好了。
12)配置packager服务
摇晃设备(海马模拟器在->更多里面),可以打开调试菜单
点击Dev Settings,选Debug server host for device,输入本机IP加:8081(如:192.168.3.35:8081),再按back键返回,再按Menu键,在调试菜单中选择Reload JS,就可以看到运行结果。
注:双击R也可以Reload JS,就不用摇晃模拟器了
13)大功告成!步骤6以下的过程(除了安装海马玩模拟器)会非常的慢,而且过程中会报错、无响应等等。只需要等!!!主要看网速,没办法天朝的网络被墙了(用VPN的土豪可以略过)!报错就重新来一遍,亲测是没问题的。
注:安装Android SDK Build-Tools 23.0.1的过程参看:搭建开发环境 - react native 中文网