React-Native环境的搭建并运行facebook例子

react-native环境的搭建

1、安装Homebrew

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

可以通过下面命令查看Homebrew是否安装成功

brew -v

2、安装Node.js

可以通过下载地址（Node.js官网下载）：

https://nodejs.org/en/

也可以在终端运行命令：

brew install node

之后通过：

npm -v

查看安装的node.js版本

3、安装React Native 命令行工具

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

sudo npm install -g react-native-cli

安装成功后可以通过如下指令查看：

react-native --help

4、安装Xcode和android studio

不细说，Xcode可以在苹果商店下载，AS可以在官网下载安装

5、安装 watchman

watchman 是 facebook 的一个开源项目，它开源用来监视文件并且记录文件的改动情况，当文件变更它可以触发一些操作,例如执行一些命令等等

brew install watchman

6、安装 flow

开源的 JavaScript 静态类型检查器，旨在发现 JS 程序中的类型错误，以提高程序员的效率和代码质量

brew install flow

7、初始化一个项目

打开终端，cd到自己的工作目录

react-native init FirstApp

这时候可能比较慢，打开一个新的终端

cd /

打开根目录找到.npmrc文件打开加入

registry=https://registry.npm.taobao.org

或者

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

然后，来到新建的项目下：

cd FirstApp react-native run-android react-native run-ios

即可在模拟器运行 安卓模拟器command＋m或者菜单键可以打开开发菜单rr可以刷新，ios可以使用command＋d，command＋r刷新

开发工具使用WebStrom 这个 HTML 开发神器

运行facebook的例子

打开自己的项目目录，从github克隆facebook项目：

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

打开安卓模拟器，运行Movies的例子

cd react-native ./gradlew :Examples:Movies:android:app:installDebug ./packager/packager.sh

或者

./gradlew :Examples:UIExplorer:android:app:installDebug ./packager/packager.sh

注意：在运行上面的命令之前，你需要先装好Android sdk，除了这个还需要安装好NDK，并设置好环境变量。注意NDK可能不能用最新的版本，需要用10e版本，不然可能会发生错误

通过例子的分析可以对React native有个最初的了解