海马玩模拟器——搭建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 中文网
海马玩模拟器——搭建React Native环境的更多相关文章
- windows环境下搭建react native环境
一.基础软件1.安装jdk-1.8.0_922.安装android studio-2.1.2(文件大小为1.2G的那个)3.安装node.js(目前最新是6.3.0)4.安装git-2.9.05.安装 ...
- VSCode 搭建 React Native 环境
安装 React Native Tools 在插件市场搜索 react 找到 React Native Tools 进行安装: 创建的react-native的工程拖入vscode中 点击F5即可运行 ...
- 1、在MAC上搭建React Native开发环境
@import url(http://i.cnblogs.com/Load.ashx?type=style&file=SyntaxHighlighter.css);@import url(/c ...
- 搭建react native所遇到的坑
一.所遇问题 在搭建react native环境中,遇到执行react native run-android命令出现如下问题 Could not resolve all dependencies f ...
- 初学 React native | 环境搭建(在模拟器上运行)
我的电脑是windows 所以就以 windows上+Android 配置React native 环境 网上的安装教程非常多,我总结了一下,配置环境时出错原因主要是node java python ...
- react-native —— 在Windows下搭建React Native Android开发环境
在Windows下搭建React Native Android开发环境 前段时间在开发者头条收藏了 @天地之灵_邓鋆 分享的<在Windows下搭建React Native Android开发环 ...
- 史上最全Windows版本搭建安装React Native环境配置
史上最全Windows版本搭建安装React Native环境配置 配置过React Native 环境的都知道,在Windows React Native环境配置有很多坑要跳,为了帮助新手快速无误的 ...
- Mac系统下React Native环境搭建
这里记录一下在Mac系统下搭建React Native开发环境的过程: 1. 安装HomeBrew: /usr/bin/ruby -e "$(curl -fsSL https://raw.g ...
- 史上最详细Windows版本搭建安装React Native环境配置 转载,比官网的靠谱亲测可用
史上最详细Windows版本搭建安装React Native环境配置 2016/01/29 | React Native技术文章 | Sky丶清| 95条评论 | 33530 views ...
随机推荐
- pxc5.7配置安装
pxc5.7配置安装 一.准备工作 # Centos6. 最小化安装操作系统 ########################---- Centos最小化安装推荐常用依赖包---- ######### ...
- nginx配置打印请求响应内容
#放在http{}里面 log_format kyh ' [$time_local] "$request" $status \n' 'req_header:"$req_h ...
- 从LIst集合中安全的删除元素
package cn.rocker.list; import java.util.ArrayList; import java.util.Iterator; import java.util.List ...
- Oracle_异常
问题1 描述:plsql客户端列值中的中文都成了问号 分析:客户端和服务端编码不一致所致 解决:1.查询服务端数据库编码 SQL> select userenv('language') from ...
- 面向对象【day07】:析构函数(六)
二.析构函数 一.概述 析构函数,第一次听说这个函数的名称,那这个函数到底是干嘛的呢?什么才是析构函数呐? 定义:在实例销毁的时候调用的函数 二.析构函数定义 2.1 定义 1 2 3 4 5 6 7 ...
- Java面试题全集(下)转载
Java面试题全集(下) 这部分主要是开源Java EE框架方面的内容,包括hibernate.MyBatis.spring.Spring MVC等,由于Struts 2已经是明日黄花,在这里就不 ...
- Web前端框架与移动应用开发第七章
1.练习1:焦点图切换 html: <!doctype html><html><head> <meta charset="utf-8" / ...
- PHPMYWIND4.6.6前台Refer头注入+后台另类getshell分析
下载链接 https://share.weiyun.com/b060b59eaa564d729a9347a580b7e4f2 Refer头注入 全局过滤函数如下 function _RunMagicQ ...
- 23.Secondary Index
一. Secondary Index(二级索引)1.1. Secondary Index 介绍 • Clustered Index(聚集索引) ◦ 叶子节点存储所有记录(all row data) • ...
- 【BZOJ3697】采药人的路径 点分治
[BZOJ3697]采药人的路径 Description 采药人的药田是一个树状结构,每条路径上都种植着同种药材.采药人以自己对药材独到的见解,对每种药材进行了分类.大致分为两类,一种是阴性的,一种是 ...