第1章:RN - 配置iOS开发环境

年少无知,跳坑Rn,电脑已砸,人已痴狂
React Native (简称RN)是Facebook于2015年开发的移动端框架,目前支持iOS和安卓两大平台。RN使用Javascript语言,类似于HTML的JSX,以及CSS来开发移动应用,让前端开发人员只需很少的学习就可以进入移动应用开发领域。
文章底部有配置的官方文档和教学视频

一、环境需求

1.1、安装HomeBrew

Homebrew, 是Mac 系统的包管理器,用于安装 NodeJS 和一些其他必需的工具软件。用命令安装软件包,一条命令即可搞定,例如brew install node

Homebrew的安装和卸载

在终端输入如下命令:
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
安装过程中需要按回车和输入密码

如果要卸载也很简单
/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/uninstall)"
安装成功后,会自动创建/usr/local/Cellar目录来存放安装的程序,这时我们就可以使用brew命令了。

等待安装成功后验证一下brew的版本,在终端输入命令:brew -v

Homebrew 2.0.4
Homebrew/homebrew-core (git revision e3b6; last commit 2019-03-14)
Homebrew的常用命令

查找命令:brew -h
搜索软件:brew search
安装软件:brew install
卸载软件:brew uninstall
更新所有软件:brew update
更新具体软件:brew upgrade
显示安装软件:brew list
查看软件信息:brew info / home(home是打开软件的官网)
查看哪些软件需要更新:brew outdated

例如:但我们需要卸载node时,终端输入 brew uninstall node


1.2、安装Node 和 Watchman

node.js启动本地server开发环境,实时预览,编译,打包都是基于node.js的相应的npm包完成的,react native的开发环境中也涉及到这些,自然,node.js是必须安装的基础环境。

Watchman则是由 Facebook 提供的监视文件系统变更的工具。安装此工具可以提高开发时的性能。我们推荐使用Homebrew来安装 Node 和 Watchman。

在终端输入命令:brew install node 静看代码翻滚
在终端输入命令:brew install watchman 静看代码翻滚

验证Nodejs是否安装成功,在终端输入命令:node -v

JerryMacBook-Pro:~ Jerry.Yao$ node -v
v8.9.1

验证watchman是否安装成功,在终端输入命令:watchman -v

JerryMacBook-Pro:~ Jerry.Yao$ watchman -v
4.9.0

1.3 安装react-native-cli命令行工具

之前安装好的Node.js 就内置了 npm,npm是什么?Node Package Manager(node包管理器)。我们用npm来安装react-native-cli。在终端中运行以下命令:

sudo npm install -g react-native-cli

命令行里的sudo用来提升运行命令的权限
命令行里的-g是安装到全局


1.4 安装react-native框架包

React Native分发为两个npm包,react-native-clireact-native。第一个是轻量级包,应该全局安装 npm install -g react-native-cli

第二个包含实际的React Native框架代码,并在运行时本地安装到项目中react-native init。我们用GIt下载地址react-native。在终端中运行以下命令:

git clone https://github.com/facebook/react-native.git

1.5 React Native 安装配置的视频链接地址

B站上 React Native 环境配置教学视频
1.可以先看几分钟视频,在根据视频内容,复制粘贴官方文档到终端命令行

在Mac系统上完成RN开发环境的搭建
2.知乎上的参考文档内含安装,Xcode和Android Studio模拟器的方法:

React Native 官方文档

END


1.6 使用npm安装yarn
npm install yarn -g

测试查看版本:

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

推荐阅读更多精彩内容