跳到主要内容
版本:0.86

在设备上运行

在将应用发布给用户之前,最好先在真实设备上测试一下。本文件将引导你完成在设备上运行 React Native 应用以及使其准备好用于生产环境所需的步骤。

提示

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

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

开发操作系统​

1. 启用 USB 调试​

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

要在设备上启用 USB 调试,首先需要通过依次进入 设置 → 关于手机 → 软件信息,然后连续点击底部的 Build number 行七次,来启用“开发者选项”菜单。之后你可以返回 设置 → 开发者选项,启用“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 调试桥)。

$ 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

现在你可以在 Dev Menu 中启用 Fast Refresh。只要你的 JavaScript 代码发生变化,你的应用就会重新加载。

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

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

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

  1. 确保你的笔记本电脑和手机连接到同一个 Wi-Fi 网络。
  2. 在你的设备上打开 React Native 应用。
  3. 你会看到一个带有错误的红屏。这没关系。接下来的步骤会修复它。
  4. 打开应用内的 Dev Menu。
  5. 进入 Dev Settings → Debug server host & port for device。
  6. 输入你的机器的 IP 地址以及本地开发服务器的端口(例如 10.0.1.1:8081)。
  7. 返回 Dev Menu 并选择 Reload JS。

现在你可以在 Dev Menu 中启用 Fast Refresh。只要你的 JavaScript 代码发生变化,你的应用就会重新加载。

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

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