前提
系統：Ubuntu14.04LTS
1 Java：JDK8
Android Studio requires the Java Development Kit [JDK] 1.8 or higher. 需要1.8以上的jdk
2 Android Studio：2.0+ 需要2.0以上的AS
Android Studio will provide you the Android SDK and emulator required to run and test your React Native apps.
3 NodeJs：4.0+ 需要4.0以上的Node.js環境
所以開發React Native需要必須安裝以下環境和工具：
1 Node.js
2 React Native Command Line Tools
3 Android Studio
# Node.js
Node.js環境提供了React Native開發過程中對項目的管理,我們需要經常和Node.js中的npm服務器打交道.
舉例: 用npm start命令啓動React Native的啓動器；用npm install安裝項目所依賴的第三方組件；用npm publish往npm上發佈一些組件等.
下載並安裝命令:
curl -sL https://deb.nodesource.com/setup_4.x | sudo -E bash -
sudo apt-get install -y nodejs
註釋:安裝過程中出現如下錯誤# Your distribution, identified as “trusty”, is not currently supported, please contact NodeSource at https://github.com/nodesource/distributions/issues if you think this is incorrect or would like your distribution to be considered for support
解決辦法：先執行 curl -sL https://deb.nodesource.com/setup | sudo -E bash
安裝完成後，在終端，輸入npm -v即可查所安裝的node.js的版本
#React Native Command Line Tools
node.js安裝成功之後，接下來我們就可以通過npm install來安裝React Native命令行工具了.
執行命令:
npm install -g react-native-cli
註釋:1 在搭建環境的過程中有些網站需要翻牆，所以建議你事先設置好代理，如何設置代理參見http://laod.cn/的設置 hosts;
在執行sudo npm install -g react-native-cli 前需要先安裝 npm 參考 http://linmomo02.iteye.com/blog/1418346
2 npm install -g react-native-cli
npm http GET https://registry.npmjs.org/react-native-cli
npm ERR! Error: failed to fetch from registry: react-native-cli
執行： npm config set registry http://registry.npmjs.org/
npm install -g react-native-cli
React Native命令行工具安裝成功之後，可以通過react-native –help來查了它索支持的所有命令
# 安裝Android開發工具AndroidStudio
到Android開發者官網進行下載並安裝即可：developer.android.com
#安裝Watchman【可選】
sudo apt-get install automake
git clone https://github.com/facebook/watchman.git
cd watchman
git checkout v4.5.0 # the latest stable release
./autogen.sh
./configure
make
sudo make install
注意：如果make提示缺少python.h，就需要安裝python，
sudo apt-get install python-dev
#安裝flow 【可選】
注意：本步驟官方文檔裏面沒有提及，一定要先執行該步驟，不然flow-bin無法安裝
從https://github.com/facebook/flow 下載源碼
sudo apt-get install ocaml libelf-dev
make
安裝ocam
http://opam.ocaml.org/doc/Install.html
opam install depext
opam depext –install flowtype
#安裝flow-bin 【可選】
sudo npm config set registry http://registry.npmjs.org/
sudo npm config set strict-ssl false
sudo npm install -g flow-bin
#環境變量【必須】
export ANDROID_HOME=~/Android/Sdk
export ANDROID_NDK=~/Android/Ndk
export PATH=”~/Android/Sdk/tools:~/Android/Sdk/platform-tools:${PATH}”
注意：運行時會用到android sdk，環境變量必須要設置,ndk下載 http://wear.techbrood.com/tools/sdk/ndk/
#創建第一個React Native應用
執行命令:react-native init ReactProject
運行此命令之後，React Native會從npm上下載一些項目所依賴的包，並完成項目的初始化.
會自動生成一個demo工程，目錄如下：
android
index.android.js 這是android的js入口文件
index.ios.js 這是ios的js入口文件
ios
node_modules
package.json
cd ReactProject
react-native run-android 運行該應用,會啓動一個js服務 starting JS service,JS服務器是包管理服務器 也就是啓動js服務器,類似於本地服務器可以向react應用提供js部分的資源
#修改npm鏡像，提高項目初始化的速度
由於npm的服務是設在國外,所以 在初始化React Native應用或從npm上安裝一些組件的時候通常的情況下是比較慢的，通過爲npm設置一個國內鏡像的方法，可以讓npm每次下載組件的時候都從國內的鏡像上獲取,這樣初始化應用時的速度有了很大改善。
Windows修改npm鏡像的方法：
在Windows電腦上我們可以在.npmrc文件中設置npm的下載鏡像地址，.npmrc文件通常在C:\Program Files\nodejs\node_modules\npm.npmrc路徑下，打開此文件然後添加：registry = https://registry.npm.taobao.org,訪問npm的時候就會被重定向到所設置的https://registry.npm.taobao.org鏡像服務器.
#Nuclide：
Fackbook爲了方便開發，在atom的基礎上做了一個插件包Nuclide，用這個工具也可以編輯react native工程
安裝Nuclide來編寫代碼：
https://nuclide.io/docs/editor/setup/#linux__prerequisites
#運行react-native/Examples
執行命令:
git clone https://github.com/facebook/react-native.git
./gradlew :Examples:Movies:android:app:installDebug
./packager/packager.sh 重新啓動包管理器之後,在測試機器上就能看見安裝的應用了
運行RN的應用的三種方式
第一種:react-native run-android
//如果要運行iOS項目則通過下面命令
react-native run-ios
第二種: AS
第三種:npm start命令來手動啓動它
註釋:
1如果出現 What went wrong:Execution failed for task ‘:ReactAndroid:downloadJSCHeaders’.
_> javax.net.ssl.SSLException: java.lang.RuntimeException: Could not generate DH keypair
需要修改jdk版本爲java8，後面會有些java8的新特性
2當你遇到 ERROR Packager can’t listen on port 8081 這個問題時 執行
ps aux | grep react
Kill or pkill the process and then
react-native start 就可以了
3 react-native start如果發生報錯
ERROR A non-recoverable condition has triggered. Watchman needs your
help!
The triggering condition was at timestamp=1475921672:
inotify-add-watch(/home/yangjian3/reactProject/AwesomeProject/node_modules/react-native/node_modules/babel-preset-fbjs/node_modules/babel-plugin-transform-es2015-shorthand-properties)
-> The user limit on the total number of inotify watches was reached;
increase the fs.inotify.max_user_watches sysctl
All requests will continue to fail with this message until you resolve
the underlying problem. You will find more information on fixing this at
https://facebook.github.io/watchman/docs/troubleshooting.html#poison-inotify-add-watch
解決辦法
$ watchman shutdown-server