準備環境
Mac 用戶在已經有 Homebrew 和 Node 4.x 的情況下，以下都比較簡單：
npm install -g react-native-cli brew install watchman brew install flow
如果已經安裝過，就運行下面命令更新一下：
brew update brew upgrade
附 Linux and Windows Support。
先跑個 IOS 的起來試試
react-native init AwesomeProject cd AwesomeProject
在 Xcode 中打開 ios/AwesomeProject.xcodeproj（或直接運行這個文档），點擊左上角的 ▶ 即會打開 Xcode 自帶的 Simulator，非常方便。
在 Simulator 中使用快捷鍵 cmd-d 打開開發菜單，選擇 Enable Live Relaod。然後修改 index.ios.js：
// ...
var {
AppRegistry,
StyleSheet,
Text,
View,
SwitchIOS, // add
} = React;
var AwesomeProject = React.createClass({
render: function() {
return (
<View style={styles.container}>
<Text style={styles.welcome}>
Welcome to React-Native!
</Text>
<Text style={styles.instructions}>
To get started, edit index.ios.js
</Text>
<Text style={styles.instructions}>
Press Cmd+R to reload,{'\n'}
Cmd+D or shake for dev menu
</Text>
{/* add */}
<SwitchIOS />
</View>
);
}
});就能看到 App 的文字底部增加了一個 Switch 按鈕。更多的接口可以看 SwitchIOS，當然還有更多的 COMPONENTS 可以使用，這裡不再深究。
安裝 Android 環境
安裝 JDK 的文章一大堆，就不說了。brew 真是個好東西，安裝 Android SDK 和 Gradle 也很簡單：
brew install android-sdk brew install gradle
但是添加環境變量這個還是要做的：
# brew 安裝的 android-sdk 和 gradle
export ANDROID_HOME=/usr/local/opt/android-sdk
export GRADLE_HOME=/usr/local/opt/gradle
下載工具
在命令行中運行 android 即可打開 Android SDK Manager，按照 這裡的說明 安裝：
Android SDK Build-tools version 23.0.1
Android 6.0 (API 23)
Android Support Repository
注意，Build-tools 必須是 23.0.1，我就是沒看清楚選了 24.x 後面一直報錯：
Build-tools version 23.0.1
當然後續 react-native-cli 升級可能會更新 Build-tools，反正如果看到這個錯誤，就安裝對應的 Build-tools 就好啦。
虛擬機
因爲之前開發需要，我已經安裝了 Genymotion，就直接使用了。但是官網也提供了 Google emulator 的啓動方法，也不麻煩。
再跑個 Android 虛擬機的試試
設備
在 Genymotion 創建並啓動一個 device，在命令行運行：
adb devices
就能看到類似的結果：
List of devices attached
192.168.56.101:5555 device
第一列表示設備 ID，第二列表示設備狀態，device 表明可以運行。
啓動
命令行運行
react-native run-android
等等就能在虛擬機中看到啓動了和剛剛 IOS 中一樣的應用，點擊 Genymotion player 右側的菜單按鈕，同樣能打開開發菜單。
USB 調試真實設備
手機開啓 USB 調試 之後，用 USB 鏈接電腦，再次運行 adb devices 一般情況下就能看到類似：
List of devices attached
14ed2fcc device
說明你的設備已經鏈接上了，然而我手上的魅族卻怎麽也不出來。查一下 資料 很快就找到解決方案：
echo 0x2a45 > .android/adb_usb.ini
另外官網聲明：
You must have only one device connected.
有且只能有一個設備鏈接，這時候再運行 react-native run-android 理論上應該就能和虛擬機一樣跑起來了吧。然而真是圖樣圖森破，Building 到 97% 又爆一個問題：
app:installDebug Installing APK 'app-debug.apk' on 'm2 - 5.1' 03:44:04 E/2099056020: Error while uploading app-debug.apk : Unknown failure Unable to install /path/to/AwesomeProject/android/app/build/outputs/apk/app-debug.apk com.android.ddmlib.InstallException: Unable to upload some APKs at com.android.ddmlib.Device.installPackages(Device.java:920) ... :app:installDebug FAILED FAILURE: Build failed with an exception. * What went wrong: Execution failed for task ':app:installDebug'. > com.android.builder.testing.api.DeviceException: com.android.ddmlib.InstallException: Unable to upload some APKs ...
React Native 真是被各路國産機坑壞了，還好 有人給出了解決方案：將 android/build.gradle 第 8 行的版本號改成 1.2.3 即可
// Top-level build file where you can add configuration options common to all sub-projects/modules.
buildscript {
repositories {
jcenter()
}
dependencies {
classpath 'com.android.tools.build:gradle:1.2.3'
// NOTE: Do not place your application dependencies here; they belong
// in the individual module build.gradle files
}
}再來一次，App 跳出來了！然而，然而是紅色的錯誤界面吖，無論怎麽 RELOAD JS 都提示 Unable to download JS bundle。還好 不是只有我一個遇到這個問題，按照 jinmatt 的方法 試一下：
adb reverse tcp:8081 tcp:8081 react-native run-android
這回真的好了！大幅度搖一搖手機，調出開發者菜單，我喜歡 Enable Live Relaod，然後就來改改 index.android.js：
var {
AppRegistry,
StyleSheet,
Text,
View,
SwitchAndroid, // add
} = React;
var PointsMall = React.createClass({
render: function() {
return (
<View style={styles.container}>
<Text style={styles.welcome}>
Welcome to React-Native!
</Text>
<Text style={styles.instructions}>
To get started, edit index.android.js
</Text>
<Text style={styles.instructions}>
Shake or press menu button for dev menu
</Text>
{/* add */}
<SwitchAndroid />
</View>
);
}
});這回 App 的文字底部增加了一個 Android 的 Switch 按鈕。
