美文网首页
Mac ReactNative环境搭建会遇到的坑

Mac ReactNative环境搭建会遇到的坑

作者: 默_声 | 来源:发表于2019-03-29 10:13 被阅读0次

安装依赖

ReactNative官网
官网安装依赖的方法是使用了brew命令安装的,想了解brew的可以去官网看看Homebrew的官网
我的另一篇文章也有说到Mac OS 下怎么安装前往
然后就是安装RN官网步骤进行,不要遗漏。我选择的是macOS Android,不过前面的步骤都一样的,没区别。

创建新项目

这个地方有个建议,先新建文件夹cd到目标文件夹再创建工程,这样文件不会太乱

react-native init RnProject //我自己起的名,没按官方文档的,
cd RnProject
react-native run-android

步骤全都是按照官网的进行的,可就是运行不起来,接下来说踩坑。

踩坑

第一个错误

报错如下


image.png
解决方案:
npm config set registry https://registry.npm.taobao.org
npm config set disturl https://npm.taobao.org/dist

这个地方需要注意的是,之前已经配置过了,现在重新执行这个命令不是在根目录下,而是在需要创建工程的文件夹路径下执行的。(两次的配置有啥关系,区别在哪,前者的必要性,这个我现在也不是很清楚,还没去考究)
顺便删除yarn,删除方法:

cd /usr/local/bin  
rm yarn

这个地方注意,现在终端已经到了bin目录下,需要cd回到原来的目录下。
然后在重新执行

react-native init RnProject

这个报错也可能是镜像代理的问题,淘宝的镜像不是很稳定,可以换个来试试。
结果还是报错,不过错误不一样了,说明之前的问题解决了,是另一个错误。

第二个错误

image.png

错误有点长,截不全,不过红框内才是重点,说的是本地安装的版本太低了,是不是很无语,刚刚才安装的,就版本过低了,没办法,更新吧。

首先查看其版本

node -v
npm -v

然后更新至最新版本
更新npm :

npm install -g npm

更新node版本:
先清除npm缓存:

npm cache clean -f

然后安装n模块:

npm install -g n

升级node.js到最新稳定版:

n stable  //这个地方升级出现错误报错(Error: sudo required) 在命令前面加sudo  (sudo n stable)

升级完之后再次执行创建工程命令,出现下图,就是创建成功了

image.png
然后执行 react-native run-android 又报错了...
Command `run-android` unrecognized. Make sure that you have run `npm install` and that you are inside a react-native project.

其实只是我太过兴奋了,漏了步骤,先cd RnProjectreact-native run-android 然而还是报错。

第三个错误

image.png
这个问题不大,也说了什么原因,找不到SDK的路径,用Android studio创建一个工程或者打开以前的工程将local.properties文件复制到RnProject/android里面
image.png

run就可以了。
以上就是我遇到的坑。

相关文章

网友评论

      本文标题:Mac ReactNative环境搭建会遇到的坑

      本文链接:https://www.haomeiwen.com/subject/osskbqtx.html