要求
1哪审、使用Homebrew方式安裝watchman和flow
- Homebrew是OS X下面的包管理應(yīng)用,檢測(cè)Homebrew是否安裝
brew -v
- 安裝Homebrew
-
Homebrew官網(wǎng)丸边,拷貝
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
在終端運(yùn)行
-
Homebrew官網(wǎng)丸边,拷貝
- 安裝watchman
brew install watchman
(用來檢測(cè)文件變化的工具) - 安裝flow
brew install flow
(檢測(cè)JSX語法的工具)
建議定期運(yùn)行brew update && brew upgrade
,使應(yīng)用程序保持最新狀態(tài)
2背镇、安裝Node.js 4.0或者更高的版本
-
nvm安裝指南
- nvm (Node Version Manager)
- 安裝腳本
curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.31.0/install.sh | bash
- 通過克隆殿较,檢測(cè)最新版本
git clone https://github.com/creationix/nvm.git ~/.nvm && cd ~/.nvm && git checkout `git describe --abbrev=0 --tags`
- 激活nvm `. ~/.nvm/nvm.sh`
- 安裝以下內(nèi)容到`~/.bashrc`, `~/.profile`, 或 `~/.zshrc`
- `vim .bashrc`、`vim .profile`澜躺、`vim .zshrc`
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && . "$NVM_DIR/nvm.sh" # This loads nvm
- 退出編輯`:wq`
- 使用
- 查看安裝版本`nvm ls`
- 查看有什么版本可以安裝`nvm ls-remote`
- `nvm install 5`
- `nvm use 5`
- 查看node版本`node -v`
- 運(yùn)行
nvm install node && nvm alias default node
(目的安裝最新版本的Node.js蝉稳,并設(shè)置終端別名,通過node來運(yùn)行)掘鄙,使用nvm可以讓您安裝多個(gè)版本的Node.js耘戚,并且在他們之間輕松切換
快速開始
- 安裝react-native命令行工具
npm install -g react-native-cli
- 初始化項(xiàng)目
react-native init AwesomeProject
- 運(yùn)行iOS應(yīng)用程序
cd AwesomeProject
open ios/AwesomeProject.xcodeproj
- 可在
index.ios.js
中編輯代碼 - Command+R來重新加載應(yīng)用程序并且觀察發(fā)生的變化
- 項(xiàng)目目錄下,運(yùn)行npm
npm start
- 如出現(xiàn)如下問題
TransformError: /Users/admin/.nvm/AwesomeProject/node_modules/react-deep-force-update/lib/index.js: [BABEL] /Users/admin/.nvm/AwesomeProject/node_modules/react-deep-force-update/lib/index.js: Unknown option: /Users/admin/.nvm/AwesomeProject/node_modules/react-deep-force-update/.babelrc.stage
則刪除.nvm/AwesomeProject/node_modules/react-deep-force-update/.babelrc
此文件操漠,然后重新啟動(dòng)終端及項(xiàng)目
- 從網(wǎng)上下載項(xiàng)目收津,如出現(xiàn)RCTRootView.h文件找不到
解決方案:RCTRootView屬于react-native依賴中的類饿这,需要cd到工程目錄下,刪除node_modules撞秋,命令行執(zhí)行npm install即可
讓安卓支持現(xiàn)有的React Native項(xiàng)目
- 將
package.json
文件中得react-native
目錄更新到最新的版本npm install
react-native android