React Native Mac环境搭建

这里只介绍Mac 上的环境搭建，其他环境搭建请参考：
http://facebook.github.io/react-native/docs/getting-started.html 。
上面有所有环境搭建：

1、安装Homebrew

安装Homebrew是为安装Node.js做前提准备。
安装命令:

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"```
注意上面的URL必须是最新的URL，最新的URL获取地址是：http://brew.sh/index_zh-cn.html，在安装过程中会出现“Press RETURN to continue or any other key to abort”的一个提示，直接回车键，可能需要输入密码验证，验证完成通过之后，便会继续安装，直到结束，一下为部分效果图：

![18BA02B8-77FD-475F-882D-A0732397C4EC.png](http://upload-images.jianshu.io/upload_images/2310529-992969d036e688b5.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
注：可以通过下面命令查看Homebrew是否安装成功：

brew -v

2、安装Node.js

下载双击安装即可： 
下载地址： 
https://nodejs.org/en/ 
Node.js 需要 4.0 及其以上版本。安装好之后，npm 也有了。
至于Node.js安装之后，关于一个"Hello World"的教程请参考http://www.cnblogs.com/heron/p/4090169.html
注：教程中使用的var申明中‘'’号需要区分 同样不可以是中文，中文应该需要规定编码格式，不然会抛出一个“Uncaught SyntaxError: Unexpected token ILLEGAL”的异常；

3、安装React Native 命令行工具

React Native 命令行工具可以创建和初始化React Native的项目，还有其他打包等功能

npm install -g react-native-cli

如果看到有错误:permission denied, 请在命令前面加上sudo,一般都需要加sudo ，比如:

sudo npm install -g react-native-cli

下面为安装成功的效果图：

![[email protected]](http://upload-images.jianshu.io/upload_images/2310529-d21acf5f96959600.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

4、安装Xcode

Xcode 7.0 或更高版本下载地 址： 
https://developer.apple.com/xcode/downloads/
注：一定要是7.0以上版本：

![[email protected]](http://upload-images.jianshu.io/upload_images/2310529-3dc42f1be9af07fc.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

5、安装 watchman 和 flow

我们首先来安装watchman，安装watchman的命令是：

brew install watchman

效果如下：

![[email protected]](http://upload-images.jianshu.io/upload_images/2310529-0d372a979dd06485.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

接下来我们来安装flow，安装命令是：

brew install flow

效果如下：

![[email protected]](http://upload-images.jianshu.io/upload_images/2310529-186f7ba0d5e0c0ae.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
可以看到后面安装的这两个文件都很小，只有几M;

6.初始化一个项目
在某个目录，使用终端命令创建一个项目：
命令如下：

react-native init AwesomeProject

创建项目时候，可能会耗时很久，也有可能会出现一个下载npm包失败的错误，我安装时候出现了一个shasum check failed for的错误，至于这个错误的答案我在这里附上；http://blog.csdn.net/enson16855/article/details/23299787，希望可以帮到。创建项目完成之后，我们大开我们创建的项目目录，我的目录如下：

![[email protected]](http://upload-images.jianshu.io/upload_images/2310529-f5f6c9a843bb2b44.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
可以看到是分为Android和ios两个的目录，可以直接导入相应的项目进行运行，Android项目是属于Android Studio的项目。当然也可以相应的使用命令运行：

Android:

react-native run-android

IOS:

react-native run-ios

一下为ios的运行效果图：

![[email protected]](http://upload-images.jianshu.io/upload_images/2310529-45641f5c41181c8e.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

好了，以上为React Native的环境搭建的全部，有的步骤来自于其他博客，有的详细但没有截图，有的有截图但是不够详细，所以在这里记录下来，遇到的问题也有提到，若遇到的问题可在底部留言，我们共同讨论！