跳到主要内容
版本:0.80

在设备上运行

在将应用发布给用户之前,在实际设备上测试你的应用总是一个好主意。本文档将指导你完成在设备上运行 React Native 应用并将其准备好投入生产所需的步骤。

信息

如果你使用 create-expo-app 设置项目,可以通过扫描运行 npm start 时显示的二维码在 Expo Go 中的设备上运行应用。有关更多信息,请参阅 Expo 指南 在设备上运行你的项目。

在 Android 设备上运行你的应用​

开发操作系统​

1. 启用 USB 调试​

大多数 Android 设备默认只能安装和运行从 Google Play 下载的应用。你需要在设备上启用 USB 调试才能在开发期间安装你的应用。

要在设备上启用 USB 调试,首先需要启用“开发者选项”菜单,方法是进入 设置 → 关于手机 → 软件信息,然后连续七次点击底部的 构建版本号 行。然后你可以返回 设置 → 开发者选项 启用"USB 调试”。

2. 通过 USB 连接你的设备​

现在让我们设置一个 Android 设备来运行我们的 React Native 项目。继续并通过 USB 将你的设备插入开发机器。

接下来,通过使用 lsusb 检查制造商代码(在 mac 上,你必须首先 安装 lsusb)。lsusb 应该输出如下内容:

$ lsusb
Bus 002 Device 002: ID 8087:0024 Intel Corp. Integrated Rate Matching Hub
Bus 002 Device 001: ID 1d6b:0002 Linux Foundation 2.0 root hub
Bus 001 Device 003: ID 22b8:2e76 Motorola PCS
Bus 001 Device 002: ID 8087:0024 Intel Corp. Integrated Rate Matching Hub
Bus 001 Device 001: ID 1d6b:0002 Linux Foundation 2.0 root hub
Bus 004 Device 001: ID 1d6b:0003 Linux Foundation 3.0 root hub
Bus 003 Device 001: ID 1d6b:0002 Linux Foundation 2.0 root hub

这些行代表当前连接到你的机器的 USB 设备。

你需要找到代表你手机的那一行。如果有疑问,尝试拔掉手机并再次运行命令:

$ lsusb
Bus 002 Device 002: ID 8087:0024 Intel Corp. Integrated Rate Matching Hub
Bus 002 Device 001: ID 1d6b:0002 Linux Foundation 2.0 root hub
Bus 001 Device 002: ID 8087:0024 Intel Corp. Integrated Rate Matching Hub
Bus 001 Device 001: ID 1d6b:0002 Linux Foundation 2.0 root hub
Bus 004 Device 001: ID 1d6b:0003 Linux Foundation 3.0 root hub
Bus 003 Device 001: ID 1d6b:0002 Linux Foundation 2.0 root hub

你会看到拔掉手机后,具有手机型号的行(本例中为 "Motorola PCS")从列表中消失了。这就是我们关心的行。

Bus 001 Device 003: ID 22b8:2e76 Motorola PCS

从上面的行中,你需要获取设备 ID 的前四位数字:

22b8:2e76

在本例中,它是 22b8。这是 Motorola 的标识符。

你需要将其输入到你的 udev 规则中才能正常运行:

echo 'SUBSYSTEM=="usb", ATTR{idVendor}=="22b8", MODE="0666", GROUP="plugdev"' | sudo tee /etc/udev/rules.d/51-android-usb.rules

确保你将 22b8 替换为上述命令中获得的标识符。

现在通过运行 adb devices 检查你的设备是否正确连接到 ADB(Android Debug Bridge)。

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

在右列看到 device 意味着设备已连接。你必须一次只连接一个设备。

3. 运行你的应用​

从项目的根目录,在命令提示符中输入以下内容以在设备上安装并启动你的应用:

npm run android

如果你收到 "bridge configuration isn't available" 错误,请参阅 使用 adb reverse。

提示:你也可以使用 React Native CLI 生成并运行 release 构建(例如,从项目根目录:yarn android --mode release)。

连接到开发服务器

你还可以通过连接到开发机器上运行的开发服务器在设备上快速迭代。根据你是否可以使用 USB 电缆或 Wi-Fi 网络,有几种方法可以实现这一点。

方法 1:使用 adb reverse(推荐)​

如果你的设备运行的是 Android 5.0 (Lollipop) 或更高版本,已启用 USB 调试,并且通过 USB 连接到开发机器,则可以使用此方法。

在命令提示符中运行以下命令:

$ adb -s <device name> reverse tcp:8081 tcp:8081

要查找设备名称,运行以下 adb 命令:

$ adb devices

你现在可以从 开发菜单 启用快速刷新。每当你的 JavaScript 代码发生更改时,你的应用都会重新加载。

方法 2:通过 Wi-Fi 连接​

你也可以通过 Wi-Fi 连接到开发服务器。首先需要使用 USB 电缆在设备上安装应用,但完成后可以按照以下说明进行无线调试。继续之前你需要开发机器的当前 IP 地址。

打开终端并输入 /sbin/ifconfig 以查找机器的 IP 地址。

  1. 确保你的笔记本电脑和手机在 同一个 Wi-Fi 网络上。
  2. 在设备上打开你的 React Native 应用。
  3. 你会看到一个 带有错误的红色屏幕。这是正常的。以下步骤将修复它。
  4. 打开应用内的 开发菜单。
  5. 进入 开发设置 → 设备的调试服务器主机和端口。
  6. 输入你的机器 IP 地址和本地开发服务器的端口(例如 10.0.1.1:8081)。
  7. 返回 开发菜单 并选择 重新加载 JS。

你现在可以从 开发菜单 启用快速刷新。每当你的 JavaScript 代码发生更改时,你的应用都会重新加载。

为生产环境构建你的应用​

你已经使用 React Native 构建了一个很棒的应用,现在迫不及待地想要将其发布到 Play Store。该过程与任何其他原生 Android 应用相同,但有一些额外的注意事项需要考虑。请参阅 生成签名的 APK 指南以了解更多。