前言：
在各种环境安装过程中，会遇到各种各样的问题，有好多问题因为本人忘记第一时间保留错误信息漏掉了，也有一些问题莫名奇妙的好了，如果各位发现有不对的地方或是不完善的地方，随时修改。顺便吐槽下android开发环境太苦逼了。
一. 安装工具
1 搭建iOS环境
参照步骤： https://reactnative.cn/docs/0.51/getting-started.html
注意：以下为安装iOS环境是遇到的问题：
问题1：当修改权限时执行 sudo chown -R whoami /usr/local 报 chown: /usr/local: Operation not permitted 错误时，可能需要重新安装一下 brew工具 （因为在os10.11的时候系统多了一个Rootless机制，Rootless机制是对抗恶意程序的最后防线）
执行如下指令：
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/uninstall)”
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)”
问题2 ：安装完brewhome 之后，ruby找不到了，pod也无法使用，如下图所示：
解决方式： 通过brew install ruby ，重新安装了一个ruby
2.搭建Android运行环境
参照步骤： https://reactnative.cn/docs/0.51/getting-started.html 选择android平台，（从此进入一条魔鬼之路）
如果本机没有java环境，需要下载java环境 下载 1.8 版本； 下载链接 http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html
下载AndroidStudio 和安装 Android SDK环境 ；
官方下载地址http://developer.android.com/sdk/index.html 下载正式版 AndroidStudio 工具 （非常慢，并且需要翻墙）
也可以到这个网站上下载：http://www.androiddevtools.cn-
下载完AndroidStudio后进行安装 参照https://reactnative.cn/docs/0.51/getting-started.html#content里边的具体设置步骤；安装完启动Android Studio时，会报如下图错误：
8957300F-CA4E-4A18-9DDC-82E3E33344DE.png问题原因：没有找到Android SDK环境，说明SDK下载失败，建议最好找网络较好的环境下载，预计要下载一晚上；（非常慢且需要翻墙）；
常规的解决的方法是老老实实下载SDK，但如果网络环境确实不行，可以把其他开发人员的电脑上下载好的 Android SDK考过来，但是这个会引入新的问题，一般情况SDK路径都在/Library/Android/sdk 目录下，可以通过 终端执行echo $ANDROID_HOME查看具体的路径；
本人就是把其他人员的SDK copy到这个目录下的，本以为万事大吉，结果发现 执行 adb 指令时 发现报错，按照网上查的资料大部分都是说路径不对找不到，但我确认路径没问题，进入/Users/mao/Library/Android/sdk/platform-tools 下手动点击adb 执行脚本，结果发现问题如下图，原来是copy过来的sdk，被系统拦截了，然后手动确认后，其他执行文件我都挨个点了一遍，完美解决了； 但是目前还不知道是否会遇到其他问题，最好还是老老实实从官方下载SDK；
image.png -
安装Genymotion 和 VirtualBox工具； 下载地址：https://www.genymotion.com/account/login/ 建议官方网站上下载最新版本，老版本在安装模拟器时下载到100%时总会提示下载文件有问题；注意：这个针对个人用户是免费的，需要用户自己注册账号； （下载也比较慢）
51B35DB8-A179-4FA1-926A-9E958ACE0E28.png -
在Genymotion 中设置custom 的sdk 环境，这样在终端中执行 react-native run-android 可以启动，不然会报错只能通过允许android studio来启动；配置如下图：
3980CEAB-B401-404D-941F-39CE86EB547E.png
二. 创建RN工程
2.1 直接创建一个RN工程
终端执行 react-native init TestRN //开始自动创建工程
说明：初始化需要一段时间，初始化完成后，会看到如下log信息，说明ReactNativew 环境安装完成；
可以通过提示的方法，启动工程：
To run your app on iOS:
cd /Users/mao/Desktop/AwesomeProject
react-native run-ios
- or -
Open ios/AwesomeProject.xcodeproj in Xcode
Hit the Run button
注意：
问题1：在执行 react-native run-ios 启动工程时，如果遇到如下的错误信息：
xcrun: error: unable to find utility "instruments", not a developer tool or in PATH
解决方法 执行sudo xcode-select -s /Applications/Xcode.app/Contents/Developer/
在启动就正常了
问题2：在执行raect-native start的过程中，出现 ERROR Metro Bundler can't listen on port8081 错误，说明端口被占用了，如图：
解决：
说明端口被占，之前有服务没有停止，关闭终端窗口，重新执行 react-native run-ios 即可，如果还不行，执行如下命令可查询哪些服务在使用该端口号：
lsof -i :8081 // 打印使用8081端口的服务；
kill -9 <PID> //可以杀死该进程；
问题3：通过reac-native run-android 时，出现如下错误：
解决方式：先手动打开Genymotion ，启动一个android模拟器, 在执行 上述指令即可启动android模拟器安装应用；
2.2 在已有工程中引入RN框架
可参照流程：[https://reactnative.cn/docs/0.51/integration-with-existing-apps.html#content](https://reactnative.cn/docs/0.51/integration-with-existing-apps.html#content)
通过xcode 创建一个新工程
然后可在项目根目录下创建一个ReactComponent的文件夹用来放react相关的文件；
在ReactComponent中创建一个package.json 配置文件，这个文件相当于podfile文件一样为安装；
-
执行 npm install ，此时会花费一定的时间node_modules文件，有可能出现如下问题：
AE9862E7-6956-4403-81BB-DE6A355AA0B8.png解决： npm cache clean --force 执行一下清理就可以了
修改podfile文件，引入react库文件，需要注意当前使用的rn版本，可以在package.json中查看，也可以使用react-native -v的方式查看当前的版本；
-
修改完podfile文件之后，在此执行一下pod install指令，注意：因为react库在npm 里边已经存在，并且已经下载到本地，所以这里边用的是本地路径；如果出现如下图所示错误， 说明依赖的库没有找到：
B18B1FED-A1B8-4062-97D3-CF39274B1A15.png解决：在podfile文件里边，加入 pod "Yoga", :path => "./ReactCommponent/node_modules/react-native/ReactCommon/yoga” 即可。
编写index.js 文件即可看到RN执行后的页面效果；
