跳到主要内容

在设备上运行

在真机上仔细测试应用后再发布给用户总是不会错的。本文档将指导你通过必须的步骤在设备上运行 React Native 应用，为生产做准备。

tip

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

在 Android 设备上运行应用​

开发平台​

1. 开启 USB 调试​

在默认情况下 Android 设备只能从应用市场来安装应用。你需要开启 USB 调试才能自由安装开发版本的 APP。

要开启 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（Android Debug Bridge），使用adb devices命令：

$ adb devices
List of devices attached
emulator-5554 offline   # Google emulator
14ed2fcc device         # Physical device

在右边那列看到 device 说明你的设备已经被正确连接了。注意，你每次只应当连接一个设备。

3. 运行应用​

在项目根目录下运行以下命令来在设备上安装并启动应用：

npm run android
note

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

tip

你还可以使用 React Native CLI 来生成和运行 release 版本（例如在项目根目录下：yarn android --mode release）。

从设备上访问开发服务器

在启用开发服务器的情况下，你可以快速的迭代修改应用，然后在设备上立即查看结果。有多种方式可以实现，取决于你是否有 USB 数据线或 Wi-Fi 网络。

如果你的设备运行 Android 5.0（Lollipop）或更新版本，且已开启 USB 调试并通过 USB 连接到开发机器，你可以使用此方法。

在命令行中运行：

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

要查找设备名称，运行以下 adb 命令：

$ adb devices

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

Method 2: Connect via Wi-Fi​

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

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

  1. 确保你的电脑和手机在同一个 Wi-Fi 网络中。
  2. 在设备上打开 React Native 应用。
  3. 你会看到一个红屏错误提示。这是正常的，下面的步骤会解决。
  4. 打开应用内的开发者菜单。
  5. 前往 Dev Settings → Debug server host & port for device。
  6. 输入你电脑的 IP 地址和端口号（例如 10.0.1.1:8081）。
  7. 回到开发者菜单然后选择 Reload JS。

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

为生产编译应用​

你已经使用 React Native 构建了一个很棒的应用，现在你渴望在 Play Store 中发布它。该过程与任何其他原生 Android 应用相同，但需要考虑一些额外的注意事项。按照生成签名 APK的指南了解更多信息。