第一次啟動了react-native的示例，今天主要把其中遇到的坑與解決的辦法分享給大家。如有疏漏、錯誤還望指正。

首先還是要從hybrid app這個概念說起（如果對於這個過程不感興趣的同學，可以直接往下翻，從開始配置react-native看起）。hybrid app就是混合應用。從我個人的理解，本以為就是在原生的app裡面嵌入一些網頁（webview）,直到最近去體會了一把ionic，以及react-native才感受到了自己的膚淺，具體怎麼膚淺了呢，一會再詳細說，先來看看做一個hybrid app我們該從何入手。

是的，假如我想做一個hybrid app，那麼我要怎麼做呢

除去前兩個是百度推廣的廣告，閱讀了後邊幾個連結以後，一個框架逐漸進入了我們的視野：ionic framework。跟著這篇文件的入門教程：ionic2安裝入門我初步的把ionic的web內容部署到了本地。這其中要科學上網下載一些東東，還要安裝python2（配置環境變數），速度也很慢。

到執行：

$ ionic serve

的時候，我們在瀏覽器裡訪問127.0.0.1:8100就可以看到我們的demo在瀏覽器裡運行了：

這裡讓我產生了一些疑惑，hybrid應用不是混合應用麼，怎麼這個demo裡，一行原生的程式碼也沒有，就搭建出了一個簡單的tab ui了呢？這裡完全用web前端的程式碼進行編寫，就算後邊用一些其他的方式去編譯，封裝進原生的應用，可它本質不還是一個web app麼。那麼hybrid app到底是什麼呢？

帶著這樣的疑惑我又百度了一下hybrid app的百度百科，其中有一段講分類，hybrid app可以分為：多View混合型、單View混合型、web主體型，等三種類型。那麼ionic框架搭建的app就屬於第三種web主體型了。

那麼既然已經有了這麼一個demo，我就想把它打包成一個apk，放到手機上跑一下，看看什麼效果嘍。根據文件說明，我們需要首先給這個專案增加一個平臺的支援：

ionic platform add android //博主是窮人用安卓機

就這樣，博主的電腦開始了無盡的下載與編譯過程，斷斷續續，重啟了三次，耗時兩天，還是沒有完成這個編譯的過程，最後的畫面停留在了下載某些jar包的過程中（幾個小時沒動了，科學上網後，重啟兩次也到這裡不動了）：

ionic，我們的緣分就到這裡吧，借用宋冬野的一句歌詞：愛上一匹野馬，可我的家裡沒有草原。ionic你還是在長城外邊馳騁吧。

恰逢等待ionic下載的間隙，我又開始了react-native的學習。react-native是最近很火熱的一套移動應用開發解決方案（我開始把它歸到hybrid app裡，但隨著認識的加深，我發現它並不是通常意義上的hybrid app，它使用js編寫程式，解譯後交給原生應用去渲染ui，或者直接呼叫原生程式碼，相比其他hybrid app在頁面上進行混合，它更多的是在程式內部、編碼方式上進行的混合），具體的介紹網上一大堆，大家自己看嘍。

開始配置react-native

跟著這篇文件，開始安裝我們的react-native：react-native安裝
Chocolatey這個大家可以不裝的（老外用linux習慣了，對windows的手動下載安裝配置很不屑，所以想出來搞了這個自動安裝其他軟體的軟體，要科學上網的），下邊的內容可以手動安裝就好了，該科學上網的就科學上網咖。不得不說，這篇文件，我給打100分，寫的非常的詳盡，比英文版的還要詳盡，非常的實用。容易出問題的有幾點：

1.React Native執行Android時提示要下載: gradle-2.4-all.zip ，下載失敗，出現錯誤。這裡有為先賢給填了坑：下載gradle-2.4-all.zip失敗解決辦法

2.在安裝android studio後，可以開啟Tools–>Android–>SDK Manager，勾選上Show Package Details，然後在Android SDK Build Tools中勾選Android SDK Build-Tools 23.0.1。（必須是這個版本）進行下載安裝（避免出現這個錯誤：failed to find Build Tools revision 23.0.1）。

3.增加ANDROID_HOME環境變數，並在Path環境變數中增加：%ANDROID_HOME%\tools;%ANDROID_HOME%\platform-tools兩個配置(避免出現Could not get BatchedBridge Error關於這個錯誤還可以參考這個連結：Could not get BatchedBridge Error)。

配置好以後，通過usb連線上我們的電腦和手機（安卓手機，啟用開發者模式，啟用usb除錯，小米手機要額外增加配置：設定–>更多設定–>開發者選項–>（滑動到頁面最底部）關閉“啟用MIUI優化“–>完事會重啟，這樣做可以避免的問題：com.android.ddmlib.InstallException: Failed to establish session react-native），然後執行：

react-native init AwesomeProject
cd AwesomeProject
react-native run-android

也是要等待一會，下載很多jar包什麼的，相比ionic這個過程比較短，半個小時之內就搞定了，直到出現了：

看到你的手機上順利的啟動了這個demo：

好的，react-native已經正常的啟動了，可以去學習react-native的語法與元件知識了，繼續加油吧，同志們。