React Native环境配置和创建新项目

因为我是做原生iOS端应用开发的，所以这里贴出的是OS X下React Native的环境配置，供大家参考，下列步骤我都一一验证过。

本人Mac配置：
机型：MacBook Pro 13.3寸
系统：OS X EI Capitan 10.11.3
编译器版本：Xcode 7.2

---

环境配置步骤：

1.Homebrew的安装

首先建议你先安装包管理工具Homebrew(简称brew),是Mac OSX上的软件包管理工具，能在Mac中方便的安装软件或者卸载软件，它可以说是Mac下的apt－get等神器。

打开终端，输入下面的命令即可。

ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

2.安装Node.js

1.你可以用包管理工具Homebrew来安装,在终端输入下面的口令

brew install node

通过Homebrew安装，会自动安装好node和npm。

使用下面命令查询Node在那个目录下

which node

npm是Node模块管理器，功能极其强大。

npm -v //查看当前npm版本号

npm install  //安装模块到node_modules

安装之前，npm install 会先检查，node_modules目录之中是否已经存在指定模块。如果存在，就不再重新安装了，即使远程仓库已经有一个新版本。
如果你希望，一个模块不管是否安装过，npm都要强制重新安装，可以使用 －－force参数。

npm install  --force

如果想更新已安装的模块,使用下面的命令

npm update 

2.通过官网安装Node.js
https://nodejs.org/en/,选择左边多数人选择的版本

网站截图

3.安装watchman（可选）

建议你安装watchman，它是一个监控文件改动的工具。在命令行输入下列命令

brew install watchman

4.安装flow（可选）

如果您希望使用flow来为js代码加上类型检查，那么输入下列命令来安装flow

brew install flow //检查JS静态类型

差不多环境配置的工作就完成了。

---

项目创建

1.安装命令行工具

$  npm install -g react-native-cli 

提示如图所示

2.创建一个空项目

$ react-native init HelloWorld

创建成功

3.cd到创建NewProject项目的目录，在iOS目录中，双击.xcodeproj即可在Xcode中打开项目,可以看到它现在同时包含了Android和iOS目录.

目录

4.command +r 启动项目，终端和模拟器出现下面的界面是，表示你创建的项目启动成功了。

模拟器界面

React Packager界面

备注：由于网络原因，react－native命令行从npm官方源拖代码时会出现网络问题，所以请将npm仓库替换为国内镜像

npm config set registry https://registry.npm.taobao.org
npm config set disturl https://npm.taobao.org/dist

注意执行init时切记不要在前面加上sudo，否则新项目的目录所有者会变为root而不是当前用户，导致一系列权限问题，请使用chown修复。

---

小试牛刀

暂且不用管模拟器，在目录中找到index.ios.js文件，用文本编辑器打开,在和之间加上一句话，然后在编译器command ＋ r，看看效果.

Simulator Screen Shot 2016年3月31日 16.41.11.png

---

今天先这样，我会继续更新学习笔记。