在Mac平台上开发React Native 需要安装一下环境和工具
- Note.js
- React Native Command Line Tools
- Xcode/AndroidStudio
一.安装Node.js
Node.js是一个基于Chrome JavaScript运行时建立的平台， 用于方便地搭建响应速度快、易于扩展的网络应用。Node.js 使用事件驱动， 非阻塞I/O 模型而得以轻量和高效，非常适合在分布式设备上运行数据密集型的实时应用。
好了让我们安装吧
安装说明
在Mac上安装Node.js 可以通过Homebrew.
打开终端运行如下命令:(安装时间可能有点长,耐心等待)
brew install node
也可以在Node.js 官网下载安装包进行安装
安装完成后输入命令
npm - v
查看一下安装的版本号说明安装成功
二.安装React Native 命令号工具
node.js 安装成功之后,接下来我们可以通过npm install 安装React Native 命令行工具.
打开终端,输入并执行下面的命令即可完成安装
npm install -g react-native-cli
image.png
这时已经安装成功
输入查看react-native命令
react-native --help
image.png
react-native init <项目名称>创建你的react-native项目
三.Xcode/AndroidStudio
不多说了,自己去下载吧
四.创建第一个React Native应用
终端输入以下命令
react-native init HelloReactNativeApp
出现如图
image.png
安装完成后
image.png
React Native 会从npm上下载一些项目所依赖的包,并完成项目初始化
安装时报的错误
image.png
输入命令
npm install -save react@~16.4.1
如果运行Xcode还报这个错误
image.png
- 没有执行
npm install命令,没有安装依赖,此时执行npm install安装依赖即可. - 依赖已经安装,但还是会报这个错,此时将项目下node_modules文件夹删除,再次执行
npm install命令安装依赖即可.
运行起来了,但是模拟器又显示如图
image.png
有关于 No bundle URL present解决办法
查看这个链接
我的因为打开了 shadowwocks的网络代理,关掉就好了
最终大功告成
image.png
我的微博:slowdony
