海马玩模拟器——搭建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 中文网

posted @ 2016-08-23 12:39  林宇风  阅读(1628)  评论(0编辑  收藏  举报