安裝Homebrew和node.js
- 一臺mac
- Xcode 7.2或以上版本
- 安裝好Homebrew http://brew.sh/
- 安裝Node.js 4.0或更高版本(譯注:如果你并不使用Node.js開發(fā)網(wǎng)站姜凄,只是用于React Native的開發(fā)葫松,那么請先安裝homebrew渠驼,然后直接使用brew install node
安裝即可毒涧,不必按照下面的nvm的安裝步驟),如果你從未接觸過npm乐尊,推薦閱讀npm的文檔
$ brew install node
5.在命令行中輸入brew install watchman
樊诺,我們推薦安裝watchman咬最,否則你可能會遇到一個Node.js監(jiān)視文件系統(tǒng)的BUG邮辽。
6.如果你希望使用flow來為js代碼加上類型檢查蕴轨,那么在命令行中輸入brew install flow
來安裝flow港谊。(譯注:新手可以跳過這一步)
安裝ReactNative
- 安裝react-native
$ npm install -g react-native-cli
- 使用從官方服務器下載初始項目(推薦下載完成之后備份一份項目文件,因為下載起來很慢)
$ react-native init ProjectName
- cd到項目根文件,然后運行項目
$ cd ProjectName $ react-native run-ios
- 編輯 ~/ProjectName/index.ios.js 進行開發(fā)
配置一個合適的IDE(更新:我最終還是選擇了Sublime)
SublimeText配置鏈接:把SublimeText配置成ReactNative的IDE
查閱了網(wǎng)上很多帖子,大部分使用WebStorm或Atom+Nuclide.其中有幾篇帖子說Atom+Nuclide會很卡,但是我自己嘗試了之后并沒有發(fā)現(xiàn)卡頓的問題.反而手感遠勝WebStorm(或許是我個人的偏見).并且Nuclide的補全較好,畢竟Nuclide是Facebook官方為ReactNative訂制的.
這里就以Atom+Nuclide為例子配置.
- 下載Atom,并且安裝
https://atom.io/ - 打開終端,安裝nuclide
$ git clone https://github.com/facebook/nuclide.git $ cd nuclide $ npm install $ apm link
- 安裝react插件,
apm install react
插件使用技巧:http://orktes.github.io/atom-react/
小貼士,安裝了React插件之后,jsx編寫xml會有較好的自動補全. - 打開Atom的自動換行:Settings->Soft Wrap
- 使用Atom打開之前的項目: ~/ProjectName
享受Atom+ReactNative吧!
- 使用nuclide開啟服務:Cmd+Shift+P, 搜索 Start Packager,開啟服務
- 使用終端進行真機測試:
$react-native run-ios $react-native run-android
附:學習ReactNative的一些網(wǎng)站
先看ES6語法變化 http://bbs.reactnative.cn/topic/15/react-react-native-%E7%9A%84es5-es6%E5%86%99%E6%B3%95%E5%AF%B9%E7%85%A7%E8%A1%A8
官方文檔 http://facebook.github.io/react-native/
React-Native學習指南 https://github.com/ele828/react-native-guide
阮一峰 http://www.ruanyifeng.com/blog/2015/03/react.html
國內(nèi)更新較為頻繁的文章列表 https://segmentfault.com/t/react-native/blogs
知乎日報例子 https://github.com/race604/ZhiHuDaily-React-Native