React Native是一款由React框架擴展而來的用于移動應用開發(fā)的軟件，這款軟件使用了Javascript語言，所以說熟悉web前端的用戶能夠很輕松到掌握該軟件，并能夠大大將移動應用開發(fā)的難度。

【基本介紹】

React Native官方版是利用腳本語言進行原生平臺開發(fā)的一次成功嘗試，降低了前端開發(fā)者入門移動端的門檻，使你能夠在Javascript和React的基礎上獲得完全一致的開發(fā)體驗，構建世界一流的原生APP。React Native官方版著力于提高多平臺開發(fā)的開發(fā)效率 —— 僅需學習一次，編寫任何平臺。

【官方介紹】

React Native (簡稱RN)是Facebook于2015年4月開源的跨平臺移動應用開發(fā)框架，是Facebook早先開源的JS框架 React 在原生移動應用平臺的衍生產(chǎn)物，目前支持iOS和安卓兩大平臺。RN使用Javascript語言，類似于HTML的JSX，以及CSS來開發(fā)移動應用，因此熟悉Web前端開發(fā)的技術人員只需很少的學習就可以進入移動應用開發(fā)領域。

【特色介紹】

原生的iOS組件
React Native主張“Learn once, write everywhere”而非其他跨平臺工具一直宣揚的“Write once, run everywhere”。通過React Native，開發(fā)者可以使用UITabBar、UINavigationController等標準的iOS平臺組件，讓應用界面在其他平臺上亦能保持始終如一的外觀、風格。

異步執(zhí)行
JavaScript應用代碼和原生平臺之間所有的操作都采用異步執(zhí)行模式，原生模塊使用額外線程，開發(fā)者可以解碼主線程圖像、后臺保存至磁盤、無須顧忌UI等諸多因素直接度量文本設計布局。

觸摸處理
React Native引入了一個類似于iOS上Responder Chain響應鏈事件處理機制的響應體系，并基于此為開發(fā)者提供了諸如TouchableHighlight等更高級的組件。

【功能介紹】

1.用于為iOS，Android和Windows平臺編寫真實，本地渲染移動應用程序的框架。
2.使用橋接器將所有JavaScript代碼轉(zhuǎn)換為目標設備的本機語言（Android上的Java和iOS上的Objective-C）。
3.使用與常規(guī)iOS和Android應用程序相同的標準UI構建塊。
4.通過統(tǒng)一的開發(fā)團隊為Web和移動應用程序提供快速高效的移動解決方案。
5.用于構建流行的應用程序，如Facebook，Instagram，Skype，Airbnb，沃爾瑪，特斯拉等等。

【安裝步驟】

安裝Android SDK（可借助類似Android Studio安卓開發(fā)軟件來完成）；
需要配置path，加入如：E:\Android\sdk\platform-tools;E:\Android\sdk\tools;E:\Android\sdk;




安裝node.js
由于nodejs中使用GYP進行項目構建管理，而GYP是基于Python的構建工具。因此，需要先安裝Python。此外，在Windows系統(tǒng)下，nodejs采用GYP來生成Visual Studio Solution文件后，需要通過C++的編譯器將其編譯為二進制文件。因此，又需要先安裝C++編譯環(huán)境。最后，安裝nodejs【墻裂建議選擇stable穩(wěn)定版】。一系列安裝完成后，進入cmd，輸入"npm"指令后回車，出現(xiàn)形同以下畫面內(nèi)容，則安裝成功。
需要配置path，加入如：E:\Android\Python27;C:\Users\che\AppData\Roaming\npm;


安裝git
git可先不安裝，若后續(xù)步驟皆安裝完畢后。執(zhí)行react native指令拋錯,可考慮是否是這個原因造成。我之前為了排錯把這個裝上了，結果是nodejs版本問題。所以git是否有影響暫不清楚。故此處標*，望大神日后補充。

安裝react-native
在cmd中輸入：npm install -g react-native-cli，回車。 【在此之前可將npm切換至國內(nèi)鏡像：npm config set registry https://registry.npm.taobao.orgnpm config set disturl https://npm.taobao.org/dist】

項目初始化
cd選擇你想要存放項目的目錄下，執(zhí)行：react-native init cheProject(項目名稱)，回車。這個過程比較慢，至少10分鐘以上。當出現(xiàn)以下畫面，恭喜您。


真機調(diào)試
手機通過USB連接電腦，切換成調(diào)試模式后。在cmd中輸入：adb devices，可查看設備是否接入成功。安卓系統(tǒng)版本大于5.0的直接執(zhí)行：adb reverse tcp:8081 tcp:8081，實現(xiàn)端口代理配置?！拘∮?.0參考】cd至剛才初始化成功的項目目錄下，執(zhí)行：react-native run-android，初次執(zhí)行react-native需要下載一些文件等，編譯完成后會自動一個以你的項目命名的APP至你的手機上。

【使用方法】

一、react-native運行Android項目

打開Android的開發(fā)工具，并打開


進入studio主界面后，打開用react-native生成的Android項目


需要特別注意的是這一步，犯了幾次錯，一定要選擇這個Android項目下的app，用這個作為根目錄


打開后成功的界面應該是這樣的


最后可以用模擬器運行了



二、react-native中修改項目的android的工程的包名

先看下默認的RN中android中的包名


目的將包名修改為com.yunkuangji.www
修改包名需要修改的地方android/app/src/main/AndroidManifest.xml


修改android/app/BUCK中的兩個package值




修改android/app/build.gradle其中的applicationID




移動文件


將文件的包名修改為com.yunkuangji.www

【注意事項】

1.React Native現(xiàn)在使用Babel7。升級到0.56時，請確保將其升級到react-native-babel-presetv5或更新版本。如果你有使用到，請及時更新，因為Babel 7不向后兼容。
2.node 8現(xiàn)在是最低要求的版本。
3.iOS 9現(xiàn)在是最低要求的版本。任何可以運行iOS 8的設備都可以升級到iOS 9
4.WebView 只會默認加載http（s）網(wǎng)址，默認情況下會禁用geolocation。
5.為幾個組件添加流類型。我們正在遷移PropTypes和運行時檢查，而不是依靠Flow。在本發(fā)行版中，您會注意到與Flow有關的許多改進。
6.修復較新的Xcode版本的項目設置警告，刪除不必要的控制臺日志記錄。
7.很多錯誤修復。
8.Facebook內(nèi)部團隊目前正在重寫一些核心架構。這是一項正在進行的工作，我們并不期望在近期版本中使用它，但我們覺得有必要讓你知道那些提到Fabric的提交者。