Reacet-Native學習筆記以及demo在github的地址
開篇
簡介
Reacet Native 是facebook公司推出的一款能夠跨平臺開發(fā)的框架,其能夠使用js來達到安卓端和iOS端共用一套代碼開發(fā)的目的.Reacet Native 的核心設(shè)計理念是:即擁有Reacet的開發(fā)效率,又能擁有Native的用戶體驗.
開發(fā)前注意
iOS目前支持7.0以上版本,Android支持4.1以上版本
開發(fā)環(huán)境配置
環(huán)境需求
- 安裝Homebrew
在終端中輸入下面的命令,執(zhí)行的速度可能比較慢,請耐心等待其執(zhí)行完成
ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
在終端中輸入下面的命令驗證是否安裝成功
brew -v
- 安裝npm和Node.js
- 安裝watchMan
該插件用于監(jiān)控bug文件和文件變化 ,并且可以觸發(fā)指定的操作,在終端中輸入下面的命令就可以了
brew install watchman
- 安裝Flow
flow是一個 JavaScript 的靜態(tài)類型檢查器,建議安裝它,以方便找出代碼中可能存在的類型錯誤,在終端輸入下面的代碼,如果提示command not found,請加上sudo獲得最高權(quán)限
brew install flow
React Native安裝
在終端輸入
npm install -g react-native-cli
至此Reacet Native的環(huán)境就已經(jīng)全部安裝好了
創(chuàng)建Reacet Native項目
在終端中輸入下面命令
react-native init 項目名稱
如果速度較慢,可以將npm倉庫源替換為國內(nèi)鏡像:
npm config set registry https://registry.npm.taobao.org
npm config set disturl https://npm.taobao.org/dist
默認生成了三個文件夾,android和ios(iOS)為兩個平臺的原生項目,index.android.js和index.ios.js為android和ios平臺下的空殼應(yīng)用文件,我們的代碼一般就寫在這兩個文件內(nèi),客戶端那邊不用重新run就可以看到效果,node_modules文件夾主要是存放框架資源.
對index.ios.js文件的編寫軟件以及提示插件的安裝
我們采用的是WebStorm來對js文件來進行編寫,由于直接編寫并沒有代碼提示,所以這里要安裝一個插件,下載地址,下載完成后file -> import settings -> ReactNative.jar ,完成之后就可以像Xcode那樣能夠自動提示了.