React Native环境搭建

React-Native 中文网

React-Native 官网

1. Python2

2. Node

# 设置镜像源
npm config set registry https://registry.npm.taobao.org --global
npm config set disturl https://npm.taobao.org/dist --global

3.Yarn、React Native的命令行工具（react-native-cli）

# 安装yarn和React-native-cli
npm install -g yarn react-native-cli
# 设置镜像源
yarn config set registry https://registry.npm.taobao.org --global
yarn config set disturl https://npm.taobao.org/dist --global

• 创建项目

# 初始化项目
react-native init abcd
# 运行项目
react-native run-android

4. 设备上运行

$ adb devices
List of devices attached
emulator-5554 offline   # Google模拟器
14ed2fcc device         # 真实设备

5. 设备*问开发服务器

1). (Android 5.0及以上)使用adb reverse命令

注意，这个选项只能在5.0以上版本(API 21+)的安卓设备上使用。
首先把你的设备通过USB数据线连接到电脑上，并开启USB调试（关于如何开启USB调试，参见上面的章节）。

1.  运行`adb reverse tcp:8081 tcp:8081`
2.  不需要更多配置，你就可以使用`Reload JS`和其它的开发选项了。

2). (Android 5.0以下)通过Wi-Fi连接你的本地开发服务器

1.  首先确保你的电脑和手机设备在**同一个Wi-Fi环境**下。
2.  在设备上运行你的React Native应用。和打开其它App一样操作。
3.  你应该会看到一个“红屏”错误提示。这是正常的，下面的步骤会解决这个报错。
4.  摇晃设备，或者运行`adb shell input keyevent 82`，可以打开**开发者菜单**。
5.  点击进入`Dev Settings`。
6.  点击`Debug server host for device`。
7.  输入你电脑的IP地址和端口号（譬如10.0.1.1:8081）。**在Mac上**，你可以在系统设置/网络里找查询你的IP地址。**在Windows上**，打开命令提示符并输入`ipconfig`来查询你的IP地址。**在Linux上**你可以在终端中输入`ifconfig`来查询你的IP地址。
8.  回到**开发者菜单**然后选择`Reload JS`。

6. 项目效果

效果.png