在Mac上搭建React Native開發環境
概述
前面我們介紹過在window環境下開發React Native專案,今天說說怎麼在mac上搭建一個RN的開發環境。
配置mac開發環境
基本環境安裝
1.先安裝Homebrew:用於安裝NodeJS和其他工具。
注:Homebrew詳解,對這個比較瞭解的略過,我也是用mac沒多久,這裡給小白普及下。
Homebrew全稱Homebrew is the easiest and most flexible way to install the UNIX tools Apple didn’t include with OS X。是一個包管理器,用於在Mac上安裝一些OS X沒有的UNIX工具(比如著名的wget),Homebrew將這些工具統統安裝到了 /usr/local/Cellar 目錄中,並在 /usr/local/bin 中建立符號連結。
安裝Homebrew:
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
然後一路回車
最後出現success,就表示安裝成功了。
安裝完成後,可以用brew doctor命令檢測下是否有什麼衝突的地方。關於Homebrew其他的介紹可以自行檢視官網資料。
安裝 Node.js
React Native 需要 NodeJS 4.0或更高版本,Homebrew的Node預設包是6.0版本的,所以直接安裝即可:
brew install node
安裝React Native 命令列工具npm
之前我們說過npm是一個包管理工具,它是用來管理node的,詳細介紹請看npm詳解
命令列工具可以輕鬆建立和初始化工程:
npm install -g react-native-cli
注:如果出現錯誤 :EACCES: permission denied,使用命令: sudo npm install -g React-native-cli.
安裝Yarn
Yarn是Facebook提供的替代npm的工具,可以加速node模組的下載。React Native的命令列工具用於執行建立、初始化、更新專案、執行打包服務(packager)等任務。
npm install -g yarn react-native-cli
其他建議安裝
Watchman
Whtchman是Facebook開發的一個檢測檔案系統變化的工具,在RN開發中可以檢測js檔案等是否有變化,從而達到儲存及編譯的效果。這個在windows中也有,個人覺得可裝也可以不裝,直接手機上reload也是可以的。
brew install watchman
Flow
靜態型別檢查工具
brew install flow
Nuclide
Facebook推出的一款React Native整合開發環境(IDE),不過我不太喜歡,我一般用webstorm+Android/ios 的ide。
快速開發React Native
每次學習一門新的語言,我們總是總喜歡來一個helloWord。
react-native init HelloWord
cd HelloWord
react-native run-ios
注:也可以用Xcode開啟iOS/HelloWord.xcodeproj 並點選Run按鈕。
小提示:react-native命令列從npm官方源拖程式碼時會遇上麻煩。請將 npm倉庫源替換成淘寶的:
npm config set registry https://registry.npm.taobao.org --global
npm config set disturl https://npm.taobao.org/dist --global
關於在mac上怎麼搭建Android的執行環境這裡不在講解,大家可以看看我之前的文章React 和Android的整合,這篇文章也是補了之前RN在windows環境下開發,而沒有在mac下開發,後面我們將講解怎麼在mac上開發一款RN應用。