前言

早在2017年，第一次尝试使用RN的时候，配置开发环境搞了一天的时间，导致我对RN的第一印象不是很好，搞定HelloWorld后就跑路了。现在时隔三年，决定再次学习下RN，这次好了很多，配置开发环境用了两天的时间。。。

整体给我的感觉就是，当你决定学习它的时候，最好是把RN配置相关的环境都升到最新，这样问题还能少些。

环境说明

• Mac:Catalina10.15.5
• ReactNative:0.62.2
• Xcode:11.5
• AndroidStudio:4.0
• Node:12.9.1
• Java:14.0.1
• cocoapods:1.9.1

以上这些基本都是目前的最新版（Node不是），如果有一个版本和上面的不一致，都有可能导致RN跑不起来。比如说以当前的环境跑RN0.4x.x或者是0.5x.x，都是跑不起来的。

软件安装#在设置nrm前，请确保复制一份.npmrc文件，以免造成配置丢失npxnrmusetaobao#使用淘宝源，npxnrmusenpm#使用npm的默认源/bin/bash-c"$(curl-fsSLhttps://raw.githubusercontent.com/Homebrew/install/master/install.sh)"#安装homebrewbrewinstallwatchmanflowhomebrew/cask/javacocoapods#必须安装的软件npminstall-gyarn#建议安装yarn

打开Xcode》Preferences》Locations，确保安装了CommandLineTools

使用brewcaskinfojava命令可查看javasdk相关的信息

运行到Iphone配置

初始化一个RN项目

npxreact-nativeinitMyApp--version0.62.2

初始化完成后，如果执行npxreact-nativerun-ios会提示让进入到ios目录执行podinstall命令安装依赖，为了能正常安装这些依赖，需要把镜像源换成国内的，方法如下：

$cd~/.cocoapods/repos$podreporemovemaster$gitclonehttps://mirrors.tuna.tsinghua.edu.cn/git/CocoaPods/Specs.gitmaster#最后进入自己的工程，在自己工程的podFile第一行加上$source'https://mirrors.tuna.tsinghua.edu.cn/git/CocoaPods/Specs.git'

参考：mirror.tuna.tsinghua.edu.cn/help/CocoaP…

然后执行podinstall就可以了，如果安装失败，可以删除再试一次（请确保外网是能正常访问的）

最后在项目目录下执行npxreact-nativerun-ios，看到iphone模拟器启动就表示成功了。第一次启动用时较长，5分钟左右，默认是iphone11。

运行到Android配置

运行到Andriod模拟器前，需要确定下面的依赖已经安装：

查看方式是：启动AndriodStudio》点击右下角configure》选择SDKManager。

SDK确定安装后，需要安装一个模拟器：

安装方式是：启动AndriodStudio》点击右下角configure》选择AVDManager。

由于包比较大，安装比较耗时间。以上都安装完成后，在项目目录下执行npxreact-nativerun-android，惊喜来啦，出现了新的错误。。。

莫名其妙的错误，解决方法点击这里，简而言之就是下面两步：

#打开目录下这个文件/android/gradle/wrapper/gradle-wrapper.properties#把gradle-6.0.1-all.zip修改为gradle-6.3-all.zipdistributionUrl=https\://services.gradle.org/distributions/gradle-6.3-all.zip

然后就能run起来了

注意事项

• 如果在run-ios时候出错，可以关闭终端和模拟器，再试下可能就成功了。
• 很多依赖包体积都很大，所以一定要确保网速够快，不然会急死的。
• 外网一定要能访问，且速度不能太慢，不然终端就是一片红。

结语

折腾了那么长时间总算是把环境搞定了，真的是心累，如果后面发现了什么便捷的配置方式再更新文章吧。

以上，感谢阅读！