配置ReactNative開發環境

1、環境需求

一、安裝Homebrew

Homebrew是OS X的套件(包)管理器，用於安裝Node.js和一些其餘必須的工具軟件。

安裝方式:

ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
複製代碼

二、安裝npm 和 Node.js

brew install node
複製代碼

node安裝成功後npm自動也就有了，直接下載安裝Node.js，網址：https://nodejs.org/en/download/

三、安裝WatchMan

WatchMan是由Facebook提供的監視文件系統變動的工具。安裝此工具能夠提升開發時的性能（packager能夠快速捕捉文件的變化從而實現實時刷新）。

brew install watchman
複製代碼

四、安裝Flow

flow是一個 JavaScript 的靜態類型檢查器。這一語法並不屬於ES標準，只是Facebook自家的代碼規範。因此新手能夠直接跳過（即不須要安裝這一工具，也不建議去費力學習flow相關語法）。

brew install flow
複製代碼

2、React Native安裝

Yarn、React Native的命令行工具（react-native-cli）

**    **   Yarn是Facebook提供的替代npm的工具，能夠加速node模塊的下載。React Native的命令行工具用於執行建立、初始化、更新項目、運行打包服務（packager）等任務。

npm install -g yarn react-native-cli
複製代碼

3、管理React Native庫的版本

一、查看本地的React Native的版本

命令行輸入

react-native --version
複製代碼

命令行效果

二、更新本地的React Native的版本

命令行輸入

npm update -g react-native-cli
複製代碼

三、查詢react-native的npm包最新版本

PM的全稱是Node Package Manager ，是一個NodeJS包管理和分發工具，已經成爲了非官方的發佈Node模塊（包）的標準。 npm包地址 ：

https://www.npmjs.com/package/react-native
複製代碼

命令行查詢

npm info react-native
複製代碼

查詢效果

也能夠在項目中查看

四、升級或者降級npm包的版本

只要把上圖終端中選擇列出的一個版本號複製粘貼到對應位置替換便可，如降級到0.24.1

npm install --save react-native@0.24.1
複製代碼

WebStom設置React Native代碼提示

下載xml插件，解壓按下面提示放到對應位置

https://github.com/virtoolswebplayer/ReactNative-LiveTemplate
複製代碼

Mac下安裝 提示：若是沒有templets文件夾，你能夠手動建立一個

webstorm11安裝路徑 將ReactNative.xml 複製到 ~/Library/Preferences/WebStorm11/templates

webstorm2016.2安裝路徑 將ReactNative.xml 複製到 ~/Library/Preferences/WebStorm2016.2/templates

webstorm2017.1安裝路徑 將ReactNative.xml 複製到 ~/Library/Preferences/WebStorm2017.1/templates

重啓 WebStorm