React Native開發環境的配置
1.安裝Homebrew:
在MAC中開啟終端工具並輸入如下語句:
ruby -e "$(curl --insecure -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
上述步驟中會提示輸入密碼然後開始下載Homebrew,如果此時網速不穩定可能會出現錯誤提示:curl: (35) Server aborted the SSL handshake。
此時需要執行解除安裝操作,輸入如下命令進行解除安裝:
ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/uninstall)"
安裝完成會有以下提示:
2.安裝npm和Node.js
brew install node
3.安裝WatchMan
該外掛用於監控bug檔案和檔案變化 ,並且可以觸發指定的操作
執行安裝
brew install watchman
ps:在Mac OS X 10.11(El Capitan)版本中,homebrew在安裝軟體時可能會碰到/usr/local目錄不可寫的許可權問題。可以使用下面的命令修復:
sudo chown -R `whoami` /usr/local
4.安裝Flow
flow是一個 JavaScript 的靜態型別檢查器,安裝後,方便找出程式碼中可能存在的型別錯誤
執行安裝
brew install flow
更新
如果已經安轉了以上的軟體,需要更新到當前最新版本。
首先更新Homebrew的版本庫:
brew update
更新Homebrew庫的內容:
brew upgrade
清除不再使用的資源:
brew cleanup
React Native安裝
安裝React Native:
npm install -g react-native-cli
ps:如果提示root許可權不夠
sudo npm install -g react-native-cli
安裝成功
建立新專案
react-native init 專案名稱 react-native init 專案名稱 --version 0.40.0 //建立一個指定版本為0.40.0版本的專案
ps:由於網路原因,需要等待一段時間。react-native命令列從官方npm獲取程式碼會很慢,可以將npm倉庫源替換為國內映象:
npm config set registry https://registry.npm.taobao.org
npm config set disturl https://npm.taobao.org/dist
接下來,執行專案
執行iOS:
react-native run-ios
執行Android:
react-native run-android
ps:一些相關查詢
檢視本地的React Native的版本
react-native --version
更新本地的React Native的版本
npm update -g react-native-cli
查詢react-native的npm包最新版本
npm info react-native
升級或者降級npm包的版本
npm install --save [email protected]
更新專案templates檔案(可選)
react-native upgrade
執行專案:
成功。
ps:如果終端提示
transforming [========================================] 100% 406/407Error while persisting cache: TransformError: /Users/maying/WorkSpace/ReactNative/HelloWork/node_modules/react-deep-force-update/lib/index.js: [BABEL] /Users/maying/WorkSpace/ReactNative/HelloWork/node_modules/react-deep-force-update/lib/index.js: Unknown option: /Users/maying/WorkSpace/ReactNative/HelloWork/node_modules/react-deep-force-update/.babelrc.stage
是因為React Native升級了babel6,babel6對babelrc檔案的解析有變更,而其他第三方元件還沒有跟上這個變化。提示的很清晰,刪除檔案即可,刪除react-deep-force-update/.babelrc。
解決辦法:
cd到資料夾下ls -a然後rm即可,然後重啟即可。