Mac配置React-Native開發環境

安裝相關軟件

Homebrew

/// Homebrew用來安裝mac上面軟件工具
ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
複製代碼

Node

brew install node

注意：安裝完node若是用npm安裝其餘包時進度緩慢能夠設置npm鏡像：

npm config set registry https://registry.npm.taobao.org --global
npm config set disturl https://npm.taobao.org/dist --global
複製代碼

React-Native集成環境

sudo npm install -g react-native-cli

Xcode：運行iOS

去app Store下載便可

Android Studio：運行android

下載地址：www.android-studio.org

可選安裝

Watchman

監控文件變化
brew install watchman
複製代碼

Flow

靜態的JS類型檢查工具(實際開發基本能夠忽略)
brew install flow
複製代碼

React開發工具

選擇Atom做爲開發React-native編輯器

Atom

下載地址: atom.io

React調式工具

調式工具咱們用Facebook開發的：Nuclide

Nuclide

是由Facebook提供的基於atom的集成開發環境，可用於編寫、運行和 調試React Native應用，打開Atom Setting界面：

點擊 Packages搜索到 Nuclide點擊 install便可（重啓 atom會自動安裝 Nuclide依賴包）

Atom開發React/React-Native有力插件

• atom-react-autocomplete React代碼提示插件
• language-babel React開發核心插件
• atom-react-native-style React-native 組件css樣式提示插件
• autocomplete-js-import js包導入路徑提示插件
• autocomplete-modules React modules導入提示插件
• autocomplete-paths 加載本地文件自動提示路徑插件
• language-javascript-jsx JavaScript, ES6, ES7, React JSX, Flow支持插件
• react-es6-snippets es6寫react語法提示插件

構建React-Native項目

/// 用reac-native 初始化而且建立名爲ProjectName的React-native項目
react-native init ProjectName
/// cd 到ProjectName目錄下下面
npm start                /// 啓動開發服務器
react-native run ios     /// 便可運行在ios模擬器上面
react-native run android /// 便可運行在android模擬器上面
複製代碼

我的網站: www.wuhaichao.com

github: https://github/netyouli