快速建立React Native App
告訴大家一個好訊息,為大家精心準備的React Native視訊教程釋出了,大家現可以看視訊學React Native了。
快速建立React Native App
檢視最新的React Native官方文件你會發現,在Getting Started
章節下新新增一個Quick Start
Tab頁。Quick Start
是在v0.4.5版本新增的一種快速建立React Native App的方案,旨在為React Native開發者提供一種快捷的,無需配置任何工具,同時也無需安裝XCode與AndroidStudio就可以開發React Native App的一種方案。
本文向大家分享如何快速構建React Native App以及在使用快速構建方案中可能存在的一些問題及解決方案。
第一步:安裝create-react-native-app
create-react-native-app是React 社群孵化出來的一種無需構建配置就可以建立RN App的一個開源專案。
作為一個建立react native應用的腳手架工具,你可以通過如下命令完成安裝:
npm install -g create-react-native-app
接下來就可以通過create-react-native-app
來建立APP了:
create-react-native-app aa cd aa npm start
上述命令,會為你建立一個aa的RN專案。
create-react-native-app常用命令
npm start
啟動本地開發伺服器,這樣一來你就可以通過Expo掃碼將APP執行起來了。
npm run ios
將APP執行在iOS裝置上,僅僅Mac系統支援,且需要安裝Xcode。
npm run android
將APP執行在Android裝置上,需要Android構建工具。
npm test
執行測試用例。
執行React Native應用
想要將上述建立的aa
執行起來,你需要下載安裝Exponent
為了方便大家下載使用,我已將Exponent上傳到網盤,供大家下載使用。
然後用Expo掃碼螢幕上的二維碼,aa就可以執行在Expo上了。
提示:為了確保Expo App能夠正常訪問到你的PC,你需要確保你的手機和PC處於同一網段內或者他們能夠聯通。
編輯App
經過上述的步驟,快速開發React Native App的環境就已經搭建好了,小夥伴門是不是迫不及待的想修改一下APP來檢視執行效果了呢,接下來就可以編輯App.js來在Expo上檢視執行效果哦。
可能存在的問題及解決方案
ERROR: npm 5 is not supported yet
問題分析:
在通過create-react-native-app
命令建立一個React Native專案的時候,出現這個問題的原因是npm 5的一個bug所致@[email protected] known issue tracking
解決方法
將npm5降級到npm4,終端執行如下程式碼:
npm i [email protected] -g
然後在重新執行create-react-native-app
即可。
如果大家對快速建立React Native App還有不明白的地方,可以在文章下方給我留言,我看到了後會及時回覆的哦。
另外也可以關注我的新浪微博@CrazyCodeBoy,或者關注我的Github來獲取更多有關React Native開發的技術乾貨。
告訴大家一個好訊息,為大家精心準備的React Native視訊教程釋出了,大家現可以看視訊學React Native了。
如果,大家在開發原生模組中遇到問題可以在本文的下方進行留言,我看到了後會及時回覆的哦。
另外也可以關注我的新浪微博
,或者關注我的Github
來獲取更多有關React Native開發的技術乾貨
。
推薦學習:視訊教程《最新版React Native+Redux打造高質量上線App》