React Native 基本环境搭建及快速入门

要求

1、使用Homebrew方式安装watchman和flow

• Homebrew是OS X下面的包管理应用，检测Homebrew是否安装brew -v
• 安装Homebrew
  • Homebrew官网，拷贝
    /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"在终端运行
• 安装watchman brew install watchman(用来检测文件变化的工具)
• 安装flow brew install flow(检测JSX语法的工具)
  建议定期运行brew update && brew upgrade，使应用程序保持最新状态

2、安装Node.js 4.0或者更高的版本

• nvm安装指南
  • nvm (Node Version Manager)
  • 安装脚本
    curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.31.0/install.sh | bash
  • 通过克隆，检测最新版本

git clone https://github.com/creationix/nvm.git ~/.nvm && cd ~/.nvm && git checkout `git describe --abbrev=0 --tags`

- 激活nvm `. ~/.nvm/nvm.sh`
- 安装以下内容到`~/.bashrc`, `~/.profile`, 或 `~/.zshrc`  
- `vim .bashrc`、`vim .profile`、`vim .zshrc`

export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && . "$NVM_DIR/nvm.sh" # This loads nvm

- 退出编辑`:wq`
- 使用
    - 查看安装版本`nvm ls`
    - 查看有什么版本可以安装`nvm ls-remote`
    - `nvm install 5`
    - `nvm use 5`
    - 查看node版本`node -v`

• 运行nvm install node && nvm alias default node(目的安装最新版本的Node.js，并设置终端别名，通过node来运行)，使用nvm可以让您安装多个版本的Node.js，并且在他们之间轻松切换

快速开始

• 安装react-native命令行工具 npm install -g react-native-cli
• 初始化项目 react-native init AwesomeProject
• 运行iOS应用程序
  • cd AwesomeProject
  • open ios/AwesomeProject.xcodeproj
  • 可在index.ios.js中编辑代码
  • Command+R来重新加载应用程序并且观察发生的变化
  • 项目目录下，运行npm npm start
  • 如出现如下问题

TransformError: /Users/admin/.nvm/AwesomeProject/node_modules/react-deep-force-update/lib/index.js: [BABEL] /Users/admin/.nvm/AwesomeProject/node_modules/react-deep-force-update/lib/index.js: Unknown option: /Users/admin/.nvm/AwesomeProject/node_modules/react-deep-force-update/.babelrc.stage

则删除.nvm/AwesomeProject/node_modules/react-deep-force-update/.babelrc此文件，然后重新启动终端及项目

• 从网上下载项目，如出现RCTRootView.h文件找不到
  解决方案：RCTRootView属于react-native依赖中的类，需要cd到工程目录下，删除node_modules，命令行执行npm install即可

让安卓支持现有的React Native项目

• 将package.json文件中得react-native目录更新到最新的版本
  • npm install
  • react-native android