我的第一篇文章。初到此地博助，請(qǐng)大家多多關(guān)照险污。
不想看我 BB 的，跟著官網(wǎng)的 搭建開(kāi)發(fā)環(huán)境 步驟走，基本不會(huì)有問(wèn)題蛔糯，注意選擇指定的版本拯腮，推薦選擇最新的當(dāng)前版本。
必須安裝的軟件
Homebrew蚁飒，Node.js动壤，Watchman，react-native-cli
Homebrew
- 是什么淮逻？
Mac 系統(tǒng)的包管理器琼懊，用于安裝 Node，Watchman 等其他軟件爬早，并且可以統(tǒng)一管理哼丈。
下面的引用來(lái)自 https://www.cnblogs.com/lzrabbit/p/4032515.html 懶惰的肥兔 原創(chuàng)，版權(quán)歸作者和博客園共有
linux系統(tǒng)有個(gè)讓人蛋疼的通病凸椿，軟件包依賴(lài)削祈，
好在當(dāng)前主流的兩大發(fā)行版本都自帶了解決方案，Red hat有yum脑漫，Ubuntu有apt-get
神馬髓抑，你用mac os，不好意Mac os木有類(lèi)似的東東优幸，
淚奔中幾經(jīng)折騰總算找到了第三方支持：Homebrew吨拍，Homebrew簡(jiǎn)稱(chēng)brew，
是Mac OSX上的軟件包管理工具网杆，能在Mac中方便的安裝軟件或者卸載軟件羹饰，
可以說(shuō)Homebrew就是mac下的apt-get、yum神器碳却。
是否必須安裝队秩？
Node 也可以通過(guò) 官網(wǎng) 安裝，但是 Watchman 只能通過(guò) Homebrew 安裝昼浦。為啥要安裝 Watchman 馍资？這個(gè)后面說(shuō)。
總之关噪，你可以看看后面作者踩的坑再?zèng)Q定安不安裝鸟蟹，一來(lái)可以嘗試不安裝 Watchman 會(huì)怎么樣，二來(lái)使兔，下載這些的過(guò)程中會(huì)下載很多依賴(lài)包建钥，占空間不說(shuō)，主要是慢虐沥！很慢熊经！非常慢！怎么安裝
官網(wǎng) 首頁(yè)大字就有，終端輸入
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
列出了一大堆需要安裝的文件镐依，下載速度 30kb/s悉盆，文件總大小 21.95 Mb。居然還有 ==> The Xcode Command Line Tools will be installed. Xcode 的命令行工具也給你裝了馋吗。如果 Xcode 已經(jīng)裝了這個(gè)焕盟，應(yīng)該可以避免『暝粒可以在 Xcode -> Preferences -> Locations 菜單檢查是否已安裝脚翘。等了很久很久，上面的都下完了绍哎，跟著開(kāi)始了下載另一個(gè)文件并且報(bào)錯(cuò)来农，踩坑了。
==> Downloading https://homebrew.bintray.com/bottles-portable/portable-ruby-2.3.3.leopard_64.bottle.1.tar.gz
####################################### 55.3%
curl: (56) SSLRead() return error -9806
Error: Checksum mismatch.
Expected: 34ce9e4c9c1be28db564d744165aa29291426f8a3d2ef806ba4f0b9175aedb2b
Actual: d9569b8c254e6041413b7bfa569ad17b6011cbf4f6e8ec506e766760f07bbb1c
Archive: /Users/***/Library/Caches/Homebrew/portable-ruby-2.3.3.leopard_64.bottle.1.tar.gz
To retry an incomplete download, remove the file above.
Error: Failed to install vendor Ruby.
Failed during: /usr/local/bin/brew update --force
心里一頓***之后沉著冷靜下來(lái)發(fā)現(xiàn)這是一個(gè)文件沒(méi)下下來(lái)而已崇堰，可以手動(dòng)下載沃于。
瀏覽器打開(kāi) portable-ruby-2.3.3.leopard_64.bottle.1.tar.gz 下載，下載很慢 4kb/s海诲，半個(gè)小時(shí)都沒(méi)下好繁莹，改用迅雷試了下，1分鐘就下好了特幔。下載的文件放在 /Users/***/Library/Caches/Homebrew/portable-ruby-2.3.3.leopard_64.bottle.1.tar.gz 路徑下咨演，記得把之前的殘留同名文件刪除，或者直接替換蚯斯。
到這里事實(shí)上 Homebrew 已經(jīng)裝好了薄风，作者這里直接用 brew 命令安裝軟件去了，其實(shí)可以輸入 brew update 看看有沒(méi)有其他報(bào)錯(cuò)拍嵌，brew install 命令也會(huì)先執(zhí)行 update遭赂，都一樣。
設(shè)置國(guó)內(nèi)鏡像源：中科大横辆，清華大學(xué)撇他，Coding.net，ban.ninja
替換brew.git:
cd "$(brew --repo)"
git remote set-url origin https://mirrors.ustc.edu.cn/brew.git
替換homebrew-core.git:
cd "$(brew --repo)/Library/Taps/homebrew/homebrew-core"
git remote set-url origin https://mirrors.ustc.edu.cn/homebrew-core.git
官方：https://github.com/Homebrew/brew
https://github.com/Homebrew/homebrew-core
中科大：https://mirrors.ustc.edu.cn/brew.git
https://mirrors.ustc.edu.cn/homebrew-core.git
清華大學(xué)：https://mirrors.tuna.tsinghua.edu.cn/git/homebrew/brew.git
https://mirrors.tuna.tsinghua.edu.cn/git/homebrew/homebrew-core.git
Coding.net：https://coding.net/u/homebrew/p/homebrew/git
- 順便說(shuō)下怎么卸載龄糊，找到兩個(gè)方法逆粹，自己看著辦吧
1.
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/uninstall)"
2.
cd `brew --prefix`
rm -rf Cellar
brew prune
rm `git ls-files`
rm -r Library/Homebrew Library/Aliases Library/Formula Library/Contributions
rm -rf .git
rm -rf ~/Library/Caches/Homebrew
Node.js
是什么
Node.js 是一個(gè) JavaScript 運(yùn)行環(huán)境募疮，這個(gè)必須裝了炫惩，不裝沒(méi)法跑 React Native。
先看看自己有沒(méi)有裝過(guò)阿浓，終端輸入npm他嚷，顯示npm: command not found果然沒(méi)有。怎么安裝
- 官網(wǎng) 直接安裝，下載 pkg 安裝包直接安裝筋蓖。完成后顯示（以 8.9.4 版本為例）
This package has installed:
* Node.js v8.9.4 to /usr/local/bin/node
* npm v5.6.0 to /usr/local/bin/npm
Make sure that /usr/local/bin is in your $PATH.
用 Homebrew 規(guī)范管理
將 /usr/local/lib/node 文件夾中的內(nèi)容移到 /usr/local/Cellar/node/8.9.4/ 目錄下（版本號(hào)根據(jù)自己下載的版本號(hào)設(shè)定）卸耘，然后輸入命令行
brew switch node 8.9.4
- 通過(guò) Homebrew 安裝
brew install node
說(shuō)實(shí)話作者沒(méi)成功。先通過(guò) pkg 安裝了粘咖。然后為了驗(yàn)證用 Homebrew 安裝蚣抗，卸載了之前安裝的 Node，可能是卸載有殘留瓮下，安裝完后 npm 命令顯示 npm: command not found翰铡。
按照網(wǎng)上的辦法 uninstall，刪除相關(guān)文件讽坏，再重新安裝锭魔，仍然沒(méi)有解決。
另外路呜，通過(guò) Homebrew 不能安裝指定 node 版本或者非常麻煩迷捧。默認(rèn)安裝的是最新的不穩(wěn)定版本，可能有些模塊與穩(wěn)定版本不一致或者被廢棄胀葱。網(wǎng)上資料說(shuō)
1漠秋、安裝 homebrew-version
brew tap homebrew/versions
2、查看可安裝的node版本
brew install homebrew/versions/node
作者興致勃勃的輸入第一條命令抵屿，結(jié)果膛堤，WHAT ？
Warning: homebrew/versions was deprecated.
This tap is now empty as all its formulae were migrated.
算了不折騰了晌该，就用官方 pkg 安裝吧肥荔，Homebrew 的下載速度也沒(méi)有手動(dòng)下載快，還這么麻煩朝群。
- 怎么卸載
比較麻煩燕耿，可以參考 這篇文章
Watchman
是什么
React Native 通過(guò) Watchman 來(lái)監(jiān)視代碼文件的改動(dòng)并適時(shí)進(jìn)行編譯。就像 Xcode 在每次文件被保存時(shí)對(duì)文件進(jìn)行編譯姜胖。是否必須安裝誉帅？
看起來(lái)好像是必須的，如果不安裝可能會(huì)遇到 BUG 右莱？ 無(wú)法正常開(kāi)發(fā)蚜锨？作者不信，安裝完了之后慢蜓，把它刪除了亚再，重新跑了下項(xiàng)目，居然正常運(yùn)行晨抡，改一下代碼運(yùn)行也正常顯示了改動(dòng)后的結(jié)果氛悬。所以则剃，不安裝到底會(huì)怎樣，作者也不知道如捅，也許是安裝完后刪除有殘留之類(lèi)的棍现。不過(guò)既然大家都說(shuō)可能會(huì)有問(wèn)題，為了保險(xiǎn)镜遣，還是安裝吧己肮。怎么安裝
brew install watchman
命令是很簡(jiǎn)單，只不過(guò)悲关，運(yùn)行后顯示
Installing dependencies for watchman: autoconf, automake, libtool, pkg-config, openssl, pcre
各種依賴(lài)包需要下載朴肺。最討厭的就是為了下一個(gè)東西，下一堆亂七八糟的東西坚洽。這就算了戈稿，還巨慢！簡(jiǎn)直**不能忍讶舰。openssl 這種東西不是
mac 內(nèi)置的么鞍盗？就不能兼容一下么！
半個(gè)小時(shí)之后跳昼，它會(huì)完成的......
react-native-cli
React Native 的命令行工具般甲，必須安裝。
yarn 是替換 npm 的工具鹅颊，據(jù)說(shuō)可以加速 node 模塊下載敷存。用不著，暫不安裝了堪伍。
sudo npm install -g react-native-cli
我這需要 sudo 權(quán)限锚烦。很快，瞬間完成帝雇。測(cè)試 react-native 命令正常涮俄，安裝成功。
創(chuàng)建項(xiàng)目
cd 到想要?jiǎng)?chuàng)建的文件夾下
react-native init AwesomeProject
會(huì)在當(dāng)前目錄下創(chuàng)建名為 AwesomeProject 的工程尸闸。文件總大小 129.4MB彻亲，所以需要花點(diǎn)時(shí)間。
運(yùn)行
- 使用命令行工具運(yùn)行吮廉。
cd AwesomeProject
react-native run-ios
- 使用 Xcode 運(yùn)行
使用 Xcode 打開(kāi)AwesomeProject/ios/AwesomeProject.xcodeproj苞尝，然后像運(yùn)行 iOS 項(xiàng)目那樣，點(diǎn)擊Run按鈕宦芦。
運(yùn)行的時(shí)候宙址，有個(gè)坑。
編譯進(jìn)度卡在 double-conversion Running 1 of 1 custom shell scripts
因?yàn)樾枰玫綆讉€(gè)第三方庫(kù)來(lái)編譯踪旷，而這個(gè)庫(kù)下載非曼氛！常！慢令野！
查看 ~/.rncache/ 目錄下果然有幾個(gè)沒(méi)下載好的文件舀患。（在運(yùn)行前沒(méi)有 rncache 文件夾）
所以需要做的，就是下載好第三方庫(kù)气破，放到 rncache 目錄下聊浅。參考 解決辦法
查看需要的依賴(lài)包：https://github.com/facebook/react-native/blob/master/scripts/ios-install-third-party.sh
branch 需要修改為對(duì)應(yīng)的版本
看到以下代碼就是需要的第三方庫(kù)了：
fetch_and_unpack glog-0.3.4.tar.gz https://github.com/google/glog/archive/v0.3.4.tar.gz 69f91cd5a1de35ead0bc4103ea87294b0206a456 "\"$SCRIPTDIR/ios-configure-glog.sh\""
fetch_and_unpack double-conversion-1.1.5.tar.gz https://github.com/google/double-conversion/archive/v1.1.5.tar.gz 96a8aba1b4ce7d4a7a3c123be26c379c2fed1def
fetch_and_unpack boost_1_63_0.tar.gz https://github.com/react-native-community/boost-for-react-native/releases/download/v1.63.0-0/boost_1_63_0.tar.gz c3f57e1d22a995e608983effbb752b54b6eab741
fetch_and_unpack folly-2016.09.26.00.tar.gz https://github.com/facebook/folly/archive/v2016.09.26.00.tar.gz f3b928b5039235bad6cece638c597c6684d1e4e6
取其中的文件網(wǎng)址下載。boost_1_63_0.tar.gz 迅雷就是下載不動(dòng)现使，換瀏覽器低匙，開(kāi) vpn 又奇跡般的飛快了。其他的用迅雷下載碳锈，很快就好了顽冶。全部放到 ~/.rncache/ 目錄下。
需要注意的是文件名的問(wèn)題售碳。運(yùn)行后發(fā)現(xiàn) rncache 目錄下出現(xiàn) double-conversion-1.1.5.tar.gz 文件强重，卡在下載這個(gè)文件，其實(shí)是文件名錯(cuò)誤贸人，與之對(duì)應(yīng)的下載文件是 v1.1.5.tar.gz间景，檢查一下其他文件名，v2016.09.26.00.tar.gz 修改為 folly-2016.09.26.00.tar.gz艺智，編譯卡在哪個(gè)文件就是哪個(gè)文件名不對(duì)倘要。再運(yùn)行，編譯大概2分鐘十拣，正常運(yùn)行封拧。界面加載了一會(huì)兒，出現(xiàn)歡迎界面夭问。
開(kāi)發(fā)環(huán)境
推薦使用 Sublime Text 3（免費(fèi)哮缺，需要配置插件）或者 WebStorm（收費(fèi)）。
官方推薦 Nuclide甲喝，據(jù)說(shuō)很卡尝苇，參考 解決辦法 ，反正挺折騰埠胖。
作者使用 Sublime Text 3 糠溜，如何配置 React Native 開(kāi)發(fā)環(huán)境參考 這篇文章 。
先安裝 Package Control 直撤，安裝方法：https://packagecontrol.io/installation
View > Show Console 輸入下面一大段代碼 完成
import urllib.request,os,hashlib; h = '6f4c264a24d933ce70df5dedcf1dcaee' + 'ebe013ee18cced0ef93d5f746d80ef60'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)
安裝2個(gè)插件：
- babel-sublime：支持 Javascript非竿，ES6 和 JSX 語(yǔ)法高亮
- react-native-snippets：支持 React Native 代碼片段
安裝方法：
Sublime Text -> Preferences -> Package Control
在 Package Control 對(duì)話框中輸入 Package Control:Install Packages
在彈出的對(duì)話框中輸入 Babel ，即可找到 babel-sublime 谋竖，點(diǎn)擊安裝红柱。
安裝后啟用：打開(kāi)任意文件承匣，View -> Syntax -> Open all with current extension as… -> Bable -> JavaScript (Bable) 。
react-native-snippets 同樣在 Package Control 中锤悄，Package Control:Install Packages 韧骗，在彈出的對(duì)話框中輸入 react-native-snippets 安裝。
驗(yàn)證：在文件中輸入 rncc零聚，有自動(dòng)補(bǔ)足袍暴，即安裝成功。
其他代碼片段參見(jiàn) 插件介紹隶症。
真機(jī)運(yùn)行
作者還沒(méi)試過(guò)政模，參考 這篇文章 ，等作者踩坑了再補(bǔ)充蚂会。
參考資料
React-Native學(xué)習(xí)指南
https://reactnative.cn/docs/0.51/getting-started.html
http://wiki.jikexueyuan.com/project/react-native/getting-started.html
https://www.cnblogs.com/yexiaochai/p/6042112.html
http://www.reibang.com/p/9b7c329da68a
