React Native学习笔记2:Android环境搭建

背景

各位童鞋有木有感觉官方文档很坑啊,根据官网的描述,首先在chocolate就直接卡死了,VPN没什么卵用,于是逐个去官网下载,直到昨天才发现不用VPN也可以下!公司是windows环境,这里就先用windows搭建。

因为本身是移动开发者,所以就假设已经你已经安装Android Studio和JDK了,并且已经配置了,不然你连Android没法开发,对吧!

硬件要求

  • JDK1.8
  • Android Stduio2.0及以上
  • Android SDK6.0及以上

必装软件:

必装软件,已经放到网盘了,大家可自行下载

React-Native-Windows64

Python 2

目前不支持Python 3版本

Python官网推荐版本是2.7.13。

Node

目前不支持Node 7.1版本

  • Node官网下载

  • 目前Node官网推荐6.9.2版本,和Python2.7搭配使用

  • 在安装的时候注意选择环境,windows的就选windows,别选错了。

  • 测试安装:打开终端 -> 输入node -v ->提示版本号则安装成功

Yarn和Git:

Yarn是官网上推荐的React Native的命令行工具(react-native-cli)
Git也是命令行工具,并且有过之而无不及,个人觉得Git好用,但是现在这个版本必须得安装Yarn。

Git也是命令行工具,而且用的人也更多,个人感觉也更好用,不过现在装不装都行,个人觉得是替代系统命令行的好东西。

Yarn是Facebook提供的替代npm的工具,可以加速node模块的下载。React Native的命令行工具用于执行创建、初始化、更新项目、运行打包服务(packager)等任务,先安装了吧,省的在这上面浪费时间。

下面的用法按照Git来讲,边操作边讲解

一切默认安装,装完之后打开命令行
执行更新命令行工具,就是Yarn,前面我们已经安装好了就OK了,不用等了

npm install -g yarn react-native-cli

但是要记得你装到哪儿了,一会儿还得创建工程呢

创建工程

我觉得有必要说一下,个人实测,VPN感觉不如镜像快,不知道为毛
现在要做的是,关掉你的VPN,除非你觉得非常稳定,然后设置淘宝镜像

淘宝镜像地址:

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

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

创建工程

  1. 进入你的工作目录
  2. 执行 react-native init MyProject
  3. 耐心等着吧,别着急,网速不好的,保护好自己的蛋,容易蛋疼。
  4. 创建好了之后是可以执行命令的

运行package

  1. 命令行中进入项目目录,就是上面那个MyProject目录
  2. 执行 react-native start
  3. 继续耐心的等着
  4. 上面执行完了点击这里测试
  5. 如果上面没报错,显示JS串,说明服务端准备就绪了

运行项目

  1. 重新打开一个命令行并进入工程目录
  2. 执行 react-native run-android
  3. 耐心的等着gradle慢慢下载吧
  4. 他下载完之前你可以准备测试工作

连接设备测试

我的测试机为小米Note3

  1. 连接手机
  2. 清空你的手机助手之类的进程,他们会抢占端口
  3. 执行 adb devices 查看设备,确保连接成功
  4. 第一次运行肯定报错,手机为红色屏幕就说明对了
  5. 确保开启悬浮窗权限,如果没有的话,开启后杀死进程重新进入
  6. 开启方法:应用管理里面,点击应用权限进行设置
  7. 摇一摇手机,出现弹框,选择Dev Settings
  8. 然后点击Debug server host & port for device设置IP和端口,端口默认8081
  9. 设置完成后,回到空白页面,再次摇一摇手机,选择Reload
  10. OK了

修改项目

  1. 进入项目,打开index.android.js
  2. 随便改点什么,比如说:
export default class MyProject extends Component {
  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.welcome}>
          踏马的终于弄好了!
        </Text>
        <Text style={styles.instructions}>
          To get started, edit index.android.js
        </Text>
        <Text style={styles.instructions}>
          Double tap R on your keyboard to reload,{'\n'}
          Shake or press menu button for dev menu
        </Text>
      </View>
    );
  }
}
  1. 摇一摇手机,Reload

问题

我遇到的问题

  1. 测试手机为白屏
    解决办法是打开设置,开启悬浮窗权限,kill 进程,重新运行
  2. 安装的时候总是失败
    这是因为我的网速不好- -!
  3. 其他问题
    大部分问题可以在下面的地址找到解决办法:
    React Native 中文社区
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 211,884评论 6 492
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,347评论 3 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 157,435评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,509评论 1 284
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,611评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,837评论 1 290
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,987评论 3 408
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,730评论 0 267
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,194评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,525评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,664评论 1 340
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,334评论 4 330
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,944评论 3 313
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,764评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,997评论 1 266
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,389评论 2 360
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,554评论 2 349

推荐阅读更多精彩内容