配置MAC开发环境
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
安装完成之后,出现success界面大概如图(我没有截全):
译注:在Max OS X 10.11(El Capitan)版本中,homebrew在安装软件时可能会碰到/usr/local
目录不可写的权限问题。可以使用下面的命令修复:
sudo chown -R `whoami` /usr/local
2.安装Node,使用Homebrew来安装Node.js.React Native目前需要NodeJS 5.0或更高版本。Homebrew默认安装的是最新版本,一般都满足要求。
brew install node
如果电脑上之前已经有了brew,先更新下brew,使其在最新版本,代码如下:
brew update
可以检查下brew是否有什么问题
brew doctor
安装完node后建议设置npm镜像以加速后面的过程(或使用科学上网工具)。
npm config set registry https://registry.npm.taobao.org --global
npm config set disturl https://npm.taobao.org/dist --global
Yarn是Facebook提供的替代npm的工具,可以加速node模块的下载。React Native的命令行工具用于执行创建、初始化、更新项目、运行打包服务(packager)等任务。npm是一个包管理工具,它是用来管理node的,详细介绍请看npm详解
命令行工具可以轻松创建和初始化工程:
npm install -g yarn react-native-cli
如果你看到EACCES: permission denied
这样的权限报错,那么请参照上文的homebrew译注,修复/usr/local
目录的所有权:
sudo chown -R `whoami` /usr/local
Xcode
React Native目前需要Xcode 7.0 或更高版本。你可以通过App Store或是到Apple开发者官网上下载。这一步骤会同时安装Xcode IDE和Xcode的命令行工具。
虽然一般来说命令行工具都是默认安装了,但你最好还是启动Xcode,并在Xcode | Preferences | Locations菜单中检查一下是否装有某个版本的Command Line Tools。Xcode的命令行工具中也包含一些必须的工具,比如git等
推荐安装的工具
Watchman
Watchman是由Facebook提供的监视文件系统变更的工具。安装此工具可以提高开发时的性能(packager可以快速捕捉文件的变化从而实现实时刷新)。
brew install watchman
brew install flow
测试安装
react-native init AwesomeProject
cd AwesomeProject
react-native run-ios
你也可以在Nuclide中打开AwesomeProject
文件夹 然后运行,或是双击
ios/AwesomeProject.xcodeproj
文件然后在Xcode中点击Run
按钮。
安装完之后
用WebStorm 里面配置运行React Native
1.首先点击WebStorm右上方的下拉箭头弹出的Edit Configurations....
2.然后会进入一个配置页面.点击左上方的+.在弹出的列表中选中npm.如图.
3.在右边的配置框中,先选择Command为help.接着点击下方的+号.再点击Run External tool.
4.在弹出框中选择+号.
5.在弹出的配置框中,填写相应信息.
Name为该按钮的名字
Program为react Native的路径,终端命令:which react-native 一般都是 /usr/local/bin/react-native
Parameters填 run-ios
working directory该输入框中,先点击右边的insert macro,选择ProjectFileDir.
.
5.点击OK.接下来点击Apply回到主界面.可以看见右上方的按钮.点击即可运行项目了.
有时,需要更换不同的机型看看运行效果,这时,需要先切换至Terminal.然后敲入相应命令:
如:
react-native run-ios --simulator "iPhone 5"
解决方法:sudo rm /usr/bin/instruments
sudo ln -s /Applications/Xcode.app/Contents/Developer/usr/bin/
instruments
/usr/bin/instruments
sudo xcode-select -switch /Applications/Xcode.app/Contents/Developer
如果
sudo rm /usr/bin/instruments
Operation not permitted
这是由于OS X El Capitan中,在内核下引入了Rootless机制
重启 苹果按 开机按住Command + R 进行恢愎模拟(就是安装系统的界面)
打开终端输入csrutil disable就可以关闭了
注意:用了此方法可能导致模拟器丢失的问题
依次打开“Xcode->Window->Devices”,会发现原来”“iPhone 5”和“iPhone 5s”躺在这里,点击位于左下角的“+”按钮,新增常使用的设备即可,不常使用的设备也可以在选中后,点击“-”移除。
这样就吧丢失的模拟器可以创建导入了!