1. 程式人生 > >如何執行github上react native專案

如何執行github上react native專案

寫在前面

之前就發現百度上,關於下載github上react native專案(下文稱RN)執行的方法不全,今天抽空整理下,給大家一點靈感。

一、下載RN專案

以react-native-nba-app作為事例

二、執行RN專案

執行終端開啟對應目錄(windows下為cmd)

$ cd /Users/s/Downloads/react-native-nba-app-master/

1.第一步
npm install -g react-native-cli
2.安裝
npm install
3.啟動
react-native start
4.執行(新開一個終端執行測試下)
npm test
這裡寫圖片描述

這裡寫圖片描述
這裡寫圖片描述

可能你會問,如果在下載其他專案,這些步驟還需要重複嗎,答案是yes,每個專案都得重新npm。npm就這麼“坑“,因為node_module是不可以全域性的,而且node_module還可以巢狀node_module,當然啦,每個專案僅第一次要npm,否則的話,大家會被累死。npm有的時候下載很慢,大家可以翻牆,或者設定npm淘寶映象

$ npm install -g cnpm --registry=https://registry.npm.taobao.org

A.在安卓上執行

1.開啟下載目錄下的android資料夾下的專案(使用android studio),由於gradle下載是在外網,可能會慢,等等吧(或者科學上網)。

這裡寫圖片描述

2.執行(圖片中選單欄app後面那個按鈕)

3.搖晃一下手機設定自己電腦的ip地址

這裡寫圖片描述
這裡寫圖片描述
這裡寫圖片描述

4.再次搖晃,選擇reload js

5.居然報錯了

這裡寫圖片描述

分析下原因吧,大概意思:App.js裡只能有一個export,開啟這個檔案

這裡寫圖片描述

不小心被坑了,這個開源專案有bug,1000+的star,選它不能怪我哦。(去掉紅色框裡的export default)

儲存,再次reload js

這裡寫圖片描述

至此,安卓端已經可以運行了,下面講蘋果手機端

B.在ios端執行

1.開啟ios資料夾下的專案allyoop.xcodeproj

2.點選執行

完美,ios端沒有任何障礙,直接執行。

這裡寫圖片描述

寫在最後

對於初學者,應該對rn專案有一點認識,當然,進一步研究還靠自己。