i0S 一步一步搭建ReactNative开发环境

1 环境搭建

i0S 一步一步搭建ReactNative开发环境_第1张图片

工欲善其事,必先利其器。首先,我们需要搭建开发环境(我们以后的文章和视频均是以Mac OS X系统为基础)。React Native主要依赖以下环境。

Mac OS X操作系统。

推荐使用Xcode 7.3.0或者更高版本。

安装Node.js v6.2.1或者最新版本。

利用Homebrew安装watchman和flow。

安装React Native

安装NVM

创建第一个HelloWorld程序

下面我们一步步来安装开发环境。

1.1 安装Xcode

打开Mac电脑,打开App Store,在App Store中搜索Xcode,双击Xcode,输入apple id下载安装即可。

i0S 一步一步搭建ReactNative开发环境_第2张图片

1.2  安装Node.js

Node.js官网:https://nodejs.org

打开Node.js官网:

i0S 一步一步搭建ReactNative开发环境_第3张图片
下载v6.2.1版本,下载完成以后双击node-v6.2.1.pkg包进行安装。

1.3 利用Homebrew安装watchman和flow

i0S 一步一步搭建ReactNative开发环境_第4张图片

打开终端,按照如下操作即可.

i0S 一步一步搭建ReactNative开发环境_第5张图片

接下来通过brew安装watchman和flow.

i0S 一步一步搭建ReactNative开发环境_第6张图片
i0S 一步一步搭建ReactNative开发环境_第7张图片

1.4 NVM安装

i0S 一步一步搭建ReactNative开发环境_第8张图片
i0S 一步一步搭建ReactNative开发环境_第9张图片
i0S 一步一步搭建ReactNative开发环境_第10张图片
i0S 一步一步搭建ReactNative开发环境_第11张图片
i0S 一步一步搭建ReactNative开发环境_第12张图片

1.5  创建项目

搭建好RN环境以后,我们来创建一个HelloWorld项目。见终端。

i0S 一步一步搭建ReactNative开发环境_第13张图片

1.6 运行项目

i0S 一步一步搭建ReactNative开发环境_第14张图片

Command + R运行

接下来关闭Xcode,注意:不要关闭终端和模拟器,用Sublime打开index.ios.js,编辑,保存,选中模拟器,重新按Command+R运行即可,无需重新打开Xcode运行。

i0S 一步一步搭建ReactNative开发环境_第15张图片

你可能感兴趣的:(i0S 一步一步搭建ReactNative开发环境)