React-Native安裝以及環(huán)境配置
建議使用typora打開該文檔。重點參考這篇文檔：http://kiwi.saylove.today/?p=124 ，下面是我自己的安裝過程的總結(jié)，首先參考上面這篇文檔！
-
安裝brew
# brew 是一個Mac下快速安裝插件的工具，類似Linux的yum\apt等命令行包安裝工具。安裝方式 $ shell $ ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)" $ $ -
安裝nvm
brew install nvmnvm即node version manager,用來管理和支持Mac下多版本的node.js 。
安裝完后，根據(jù)終端提示，運行相關(guān)命令，即可配置相關(guān)環(huán)境變量，終端提示輸入如下：
You should create NVM's working directory if it doesn't exist: mkdir ~/.nvm Add the following to ~/.zshrc or your desired shell configuration file: export NVM_DIR=~/.nvm source $(brew --prefix nvm)/nvm.sh注意：我的一臺機器使用了 oh-my-zsh。因此默認(rèn)的bash是zsh，bash的配置文件是
~/.zshrc。使用的bash不同，配置的地方就不一樣。注意：source 方式可能找不到nvm.sh文件，或者在主目錄先找不到shell的幾個配置文件 .bashrc 或者 .zshrc 等，不能直接在終端輸入這些指令，否則只能在這個進程中安裝了。 最后我發(fā)現(xiàn)需要
vim ~/.bashrc vim ~/.zshrc vim ~/.bash_profile在系統(tǒng)根目錄下生成這三個文件，并配置好 source ／nvm.h。
$ mkdir ~/.nvm $ export NVM_DIR=~/.nvm $ source $(brew --prefix nvm)/nvm.sh ， 如果提示找不到nvm.sh,而cd到brew 目錄下發(fā)現(xiàn)有這個文件，可以直接這么導(dǎo)入 $ source /usr/local/opt/nvm.sh 或者：在zsh中 #nvm load nvm export NVM_DIR="$HOME/.nvm" source $(brew --prefix nvm)/nvm.sh?
? -
安裝最新的node
如果用brew或者其它方式安裝過node, 可以先刪除node
brew remove --force node sudo rm -r /usr/local/lib/node_modules brew prune sudo rm -r /usr/local/include/node #檢查brew是否正常 brew doctor安裝最新的node
nvm install node將該node設(shè)置為默認(rèn)的nvm管理的node
nvm alias default node安裝好node,其包管理工具
npm,node package manager也安裝好了，可以參考其包管理工具的命令。以下是npm常用指令：npm ls #查看當(dāng)前目錄下安裝的包 npm ls -g #查看全局安裝的包 npm install xxx #安裝xxx包 npm uninstall xxx npm info xxx npm install xxx --save #安裝xxx包，并將xxx依賴命令寫入package.json npm update xxx #我的npm安裝路徑 ~/.nvm/versions/node/v5.6.0/lib/node_modules/npm #nvm是用來管理node版本的工具，因此可以循該路徑找到node #我的node執(zhí)行的腳本bin /Users/schiller/.nvm/versions/node/v5.6.0/bin/node #我們用react-native init myRNDemo來初始化RN項目,react-native命令的原理： $ cd ~/.nvm/versions/node/v5.6.0/lib/node_modules $ ls -a $ cd react-native-cli $ ls -a .README.mdnode_modules ..index.jspackage.json $ vi package.json # package.json中有這么一段 "bin": { "react-native": "index.js" }, $ vi index.js if (args[0] === 'init') { if (args[1]) { init(args[1]); } else { } } else { ...... } 1、fs.writeFileSync(path.join(root, 'package.json'), JSON.stringify(packageJson)); 2、run('npm install --save react-native', function(e) {} #代碼1是動態(tài)生成package.json，代碼2是本地安裝react-native模塊。因此react native初始化項目困難，都是npm惹的禍經(jīng)過上面對"react-native-cli"與“react-native”的分析，可以看出Facebook應(yīng)該是推薦“react-native”模塊局部化，所以不論在React Native項目初始化的過程中，還是clone已有的React Native項目，都需要在當(dāng)前項目下下載和安裝“react-native”模塊，使得React Native 項目占用的空間越來越大。
over
? -
安裝watchman
brew install watchmanwatchman為react代碼發(fā)生變化時，完成相關(guān)的重建工具，實現(xiàn)LiveReload功能。
?
? -
安裝flow
brew install flowflow為javasript類型檢查器，實現(xiàn)靜態(tài)類型檢查
-
安裝react-native
npm install -g react-native-cli因為react-native 安裝后需要在所有目錄都可使用，因此需要全局安裝-
-
安裝nrm
npm install -g nrm nrm ls #查看有哪些可用的源地址 nrm use taobao #使用淘寶源 #也可以使用cnpm cnpm和淘寶源 cnpm --- http://r.cnpmjs.org/nrm為管理node包源地址的管理器，因為node包默認(rèn)為從國外服務(wù)器獲取，若不更換國內(nèi)源，在安裝時會非常慢
?搭建私有npm，提交創(chuàng)建項目的速度和減少緩存
起步，RN入門教程
-
創(chuàng)建項目
> ``` shell > react-native init MyReactNativeProject > ``` > > 分析項目目錄結(jié)構(gòu)，node_modules為react-native依賴的相關(guān)源代碼，package.json為rn依賴管理配置文件，resources為資源目錄，如圖片資源 >
2. 啟動
> ```objective-c
> jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle?platform=ios&dev=true"];
>
> jsCodeLocation = [NSURL URLWithString:@"http://192.168.1.116:8081/index.ios.bundle?platform=ios&dev=false"];
>
> jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
> ```
>
> 原理：
>
> ```
> 從jsCodeLocation的鏈接地址來看react-native是從本地端口拉取index.ios.js來執(zhí)行。如果將index.ios.js的名字改為test.ios.js，然后Appdelegate.m中的index.ios.bundle改為test.ios.bundle 重新執(zhí)行編譯通過，驗證假設(shè)。
> ```
>
> over.
3. 項目協(xié)作與遷移
> 項目協(xié)作，遷移到新的服務(wù)器必須執(zhí)行`nmp install `重新更新項目的配置，否則會報錯。
>
> over.
