React Native环境搭建

一、环境配置

1、下载并安装Node.js, Node.js官网

2、React Native的命令行工具(react-native-cli)

npm install -g react-native-cli

可能会出现权限问题EACCES: permission denied，
在上面命令行前加sudo, 回车后输入开机密码安装

3、开发工具

（1）安卓开发工具— — Android Studio

a、安装Android Studio, [地址]

b、管理SDK

c、配置全局环境

vi ~/.bashrc 后加入

export ANDROID_HOME=~/Library/Android/sdk

export PATH=${PATH}:${ANDROID_HOME}/tools:${ANDROID_HOME}/platform-tools

（2）IOS开发工具 — — XCode

（3）react native开发工具 — — Atom+ Nuclide插件

二、创建并运行项目

1、创建项目 react-native
init XXXProject

2、运行项目

a、cd XXXProject进入项目根目录

b、安卓： 运行安卓虚拟机 / 连接上安卓真机并开启USB调试模式后敲入： react-native
run-android

IOS： react-native
run-ios 或者 双击项目目录下xxxProject
/ ios / xxxProject.xcodeproj，然后cmmd + r 编译项目

3、加载JS

运行项目成功后，手机/虚拟机会安装上该app,

IOS虚拟机的话cmmd + d 会出现加载新js等菜单

安卓真机的话，摇一摇 —> Dev Settings —> Debug server host &port for device, 输入调试用电脑的局域网IP和端口号(默认8081);
比如输入: 192.168.2.101:8081

三、可能碰到的问题

可能碰到问题：

一、在~/.bashrc下配置了android的sdk等工具关键路径了，但是在终端敲下比如在platform-tools中的adb时并没反应，

解决方案: 在terminal终端中敲入 source ~/.bashrc

二、明明连上手机了，但是安装不上，

Could not install the app on the device, read the error above for details.
Make sure you have an Android emulator running or a device connected and have
set up your Android development environment: https://facebook.github.io/react-native/docs/android-setup.html 解决方案：直接安装编译后的apk（需先用react-native run-android编译出apk）

adb install android/app/build/outputs/apk/app-debug.apk

三、watchman环境问题

运行React-native
出现Error watching file for changes: EMFILE异常
1、卸载所有已安装的watchman：brew uninstall --force watchman
2、删除watchman相关文件：rm -rf /usr/local/var/run/watchman/

3、重新安装watchman：brew install watchman
四、brew安装后的node无法自动添加到关键路径导致npm无法正常使用(node -v npm -v均无法正常使用)
解决方案：上node官网下载安装最新的稳定版本。。