學習react-native就跟當初學習android一樣，環境搭建完畢，程式碼也不知道怎麼寫，如果也沒有demo執行一下看看這是個什麼東西，總覺得RN很神祕複雜的樣子。FaceBook官方早已經給我們準備了很好的學習資料，就是github上的官方demo，那如何跑到模擬器上，官方的介紹是相當簡潔，但既然是官方的，那就按照人家說的試著做吧，同樣作為初學者的我，耗費了兩天時間才把這個demo執行到模擬器上，遇到問題無數，現把步驟做一下整理，希望對童鞋們有所幫助。

（一） 前提條件

確保你已經安裝了react-native的執行環境（包括Node.js，Python，Android SDK，AndroidStudio2.0以上，NDK，等等），如果沒有裝，

（二） clone 程式碼

通過git工具，從github把程式碼clone到本地，執行命令：
git clone https://github.com/facebook/react-native.git
程式碼很多：

（三） 安裝cygwin

這個軟體我也沒用過，它是一個能在windows平臺上執行的類UNIX模擬環境，因為要執行一些shell命令，windows不支援，所以要安裝這個軟體。先到官網下載，根據自己電腦選擇32位/64位的，下載完之後，開始安裝：基本都是預設，點選“下一步”，

安裝路徑也是預設就行：

一直“下一步”，直到這裡，選擇下面這個url：

這裡需要選擇要安裝的元件：gcc、gcc-mingw、binutils、gdb，這四個是必須的：

選好元件之後，開始安裝，我把4個元件全選了，安裝的很慢
安裝成功之後，配置環境變數：C:\cygwin64\bin（根據自己的安裝路徑而定，這個是預設的）

測試是否安裝成功，開啟cmd命令列視窗，輸入bash，回車

這樣就是成功安裝而且配置好了。

（三） Android NDK

編譯react-native需要用到NDK，如果已經你已經安裝且配置過了“ANDROID_NDK”環境變數，這一步就過了，如果沒安裝的話，點選這裡，（準備好VPN）,然後配置“ANDROID_NDK”環境變數

（四）新增專案依賴 node_modules

環境備好之後開始編譯剛才clone到本地的專案

4.1

新增Node依賴模組，該命令列需要切到react-native專案根目錄下，執行命令：

npm install

這個可能執行很久，耐心等待，執行成功大致是這個介面，就是下載了一堆專案依賴檔案

（五）編譯專案

這裡也是我碰到錯誤最多的地方，前面幾步幾乎不會出現問題，好了按正常步驟開始執行。
開啟剛才安裝的cygwin，桌面上有快捷方式，進入到專案根目錄下

執行命令（需要開啟你的android模擬器）

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

這個專案裡包含了好幾個demo， UIExplorer 只是其中一個demo的名稱，可以自行進入專案實際目錄檢視，執行其他demo只需切換專案名稱即可。
這一步會執行很久，先看一下執行正常的介面：

我的用時是17秒，因為之前我已經編譯過一次了，執行成功，緊接著，輸入

./packager/packager.sh

打包成功！可以在模擬器上看到react-native這個app

太開心了，迫不及待地點開看看

當然了，這是沒有出問題的情況，這個命令 ./gradlew :Examples:UIExplorer:android:app:installDebug
會出現諸多問題，我碰到的就是執行task downloadBoost這個下載任務失敗，這個任務下載的react-native專案啟動時的一些檔案，都是C++的程式碼檔案，如果不能自動下載的話，那就手動來吧，開啟react-native\ReactAndroid目錄，下面有個build.gradle，很熟悉吧~~~，找到30多行的位置，就可以看到這個
task downloadBoost任務了，

把這個url複製一下，放到瀏覽器位址列，可以直接下載這個boost壓縮檔案，大概100多M，下載完成之後，放到這裡

如果沒有的話，自己造一個目錄就行。僅僅放到這裡還不行，最關鍵的一步就是，設定到環境變數，讓react-native編譯的時候能自動找到它，我們可以在build.gradle檔案中看到這兩行

System.getenv("REACT_NATIVE_DEPENDENCIES")這句話就是獲取REACT_NATIVE_DEPENDENCIES的環境變數，作為react-native的啟動目錄，上面的程式碼註釋的很清楚，不要感覺配置檔案看起來很難的樣子，我一開始也很抵觸研讀這些東西，其實只要認真，耐心看完，是可以看懂的，下面配置環境變數就很簡單啦，把路徑：D:\AndroidStudioProjects\ReactGitDemo\react-native\ReactAndroid\build\downloads（注意：這個路徑是我的！！！）設定到REACT_NATIVE_DEPENDENCIES就可以了

下面，重新開啟cygwin，重新執行./gradlew :Examples:UIExplorer:android:app:installDebug命令，應該差不多可以了，如果出現其他問題的話，這裡是官方issue的集中營，搜關鍵字試一下，會有你想要的答案。

最後，我想說的是，萬事開頭難，既然想學react-native的話，就不要害怕碰到問題，目前這門技術還不算是非常成熟，但是我覺得如果我們能在react-native普及之前學會它，那我們獲得的收穫才能最大化，我也是一路摸索著學習的，進度很慢，但肯定會越來越好的。

我也是個初學者，這篇文章裡如有錯誤之後請大家幫忙指出，個人QQ：294958260，也歡迎大家一起討論，共同學習！