在设备上运行

在将您的应用发布给用户之前，最好在实际设备上进行测试。本文档将指导您完成在设备上运行 React Native 应用并使其准备好投入生产的必要步骤。

信息

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

Android
iOS

在 Android 设备上运行您的应用

开发操作系统

macOS
Windows
Linux

1. 通过 USB 启用调试

默认情况下，大多数 Android 设备只能安装和运行从 Google Play 下载的应用。您需要在设备上启用 USB 调试，以便在开发过程中安装您的应用。

要在设备上启用 USB 调试，您首先需要启用“开发者选项”菜单，方法是转到**设置** → **关于手机** → **软件信息**，然后点击底部的 版本号 行七次。然后，您可以返回到**设置** → **开发者选项** 以启用“USB 调试”。

2. 通过 USB 连接您的设备

现在让我们设置一个 Android 设备来运行我们的 React Native 项目。继续通过 USB 将您的设备连接到开发机器。

现在，通过运行 adb devices 检查您的设备是否已正确连接到 ADB（Android 调试桥）。

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

在右侧列中看到 device 表示设备已连接。您一次只能连接一个设备。

注意

如果列表中显示 unauthorized，则需要运行 adb reverse tcp:8081 tcp:8081 并在设备上按允许 USB 调试。

3. 运行您的应用

从项目的根目录开始；在命令提示符中键入以下内容以在设备上安装并启动您的应用

npm
Yarn

npm run android

yarn android

如果出现“桥接配置不可用”错误，请参阅使用 adb reverse。

提示：您还可以使用 React Native CLI 生成和运行 release 版本（例如，从项目的根目录：yarn android --mode release）。

连接到开发服务器

您还可以通过连接到开发机器上运行的开发服务器，快速迭代设备。有几种方法可以实现此目的，具体取决于您是否有权访问 USB 线缆或 Wi-Fi 网络。

方法 1：使用 adb reverse（推荐）

如果您的设备运行 Android 5.0（棒棒糖）或更高版本、已启用 USB 调试并通过 USB 连接到开发机器，则可以使用此方法。

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

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

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

$ adb devices

您现在可以从Dev 菜单启用快速刷新。只要您的 JavaScript 代码发生更改，您的应用就会重新加载。

方法 2：通过 Wi-Fi 连接

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

您可以在**系统设置（或系统偏好设置）** → **网络**中找到 IP 地址。

确保您的笔记本电脑和手机位于**同一** Wi-Fi 网络上。
在您的设备上打开 React Native 应用。
您会看到带有错误的红色屏幕。这没关系。以下步骤将解决此问题。
打开应用内Dev 菜单。
转到**Dev 设置** → **设备的调试服务器主机和端口**。
输入您机器的 IP 地址和本地开发服务器的端口（例如 10.0.1.1:8081）。
返回**Dev 菜单**并选择**重新加载 JS**。

您现在可以从Dev 菜单启用快速刷新。只要您的 JavaScript 代码发生更改，您的应用就会重新加载。

构建您的应用以供生产

您已使用 React Native 构建了一个很棒的应用，现在您迫不及待地想将其发布到 Play 商店。此过程与任何其他原生 Android 应用相同，但需要考虑一些其他因素。请遵循生成签名 APK的指南以了解更多信息。

1. 通过 USB 启用调试

默认情况下，大多数 Android 设备只能安装和运行从 Google Play 下载的应用。您需要在设备上启用 USB 调试，以便在开发过程中安装您的应用。

2. 通过 USB 连接您的设备

现在让我们设置一个 Android 设备来运行我们的 React Native 项目。继续通过 USB 将您的设备连接到开发机器。

现在，通过运行 adb devices 检查您的设备是否已正确连接到 ADB（Android 调试桥）。

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

在右侧列中看到 device 表示设备已连接。您一次只能连接一个设备。

3. 运行您的应用

从项目的根目录开始，在命令提示符中运行以下命令以在设备上安装并启动您的应用

npm
Yarn

npm run android

yarn android

提示：您还可以使用 React Native CLI 生成和运行 release 版本（例如，从项目的根目录：yarn android --mode release）。

连接到开发服务器

您还可以通过连接到开发机器上运行的开发服务器，快速迭代设备。有几种方法可以实现此目的，具体取决于您是否有权访问 USB 线缆或 Wi-Fi 网络。

方法 1：使用 adb reverse（推荐）

如果您的设备运行 Android 5.0（棒棒糖）或更高版本、已启用 USB 调试并通过 USB 连接到开发机器，则可以使用此方法。

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

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

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

$ adb devices

您现在可以从Dev 菜单启用快速刷新。只要您的 JavaScript 代码发生更改，您的应用就会重新加载。

方法 2：通过 Wi-Fi 连接

打开命令提示符并键入 ipconfig 以查找您机器的 IP 地址（更多信息）。

确保您的笔记本电脑和手机位于**同一** Wi-Fi 网络上。
在您的设备上打开 React Native 应用。
您会看到带有错误的红色屏幕。这没关系。以下步骤将解决此问题。
打开应用内Dev 菜单。
转到**Dev 设置** → **设备的调试服务器主机和端口**。
输入您机器的 IP 地址和本地开发服务器的端口（例如 10.0.1.1:8081）。
返回**Dev 菜单**并选择**重新加载 JS**。

您现在可以从Dev 菜单启用快速刷新。只要您的 JavaScript 代码发生更改，您的应用就会重新加载。

构建您的应用以供生产

1. 通过 USB 启用调试

默认情况下，大多数 Android 设备只能安装和运行从 Google Play 下载的应用。您需要在设备上启用 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”）的行从列表中消失了。这就是我们关心的行。

总线 001 设备 003：ID 22b8:2e76 Motorola PCS

从上面的行中，您需要从设备 ID 中获取前四位数字

22b8:2e76

在本例中，它是 22b8。这是摩托罗拉的标识符。

您需要将其输入到您的 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 emulator
14ed2fcc device         # Physical device

在右侧列中看到 device 表示设备已连接。您一次只能连接一个设备。

3. 运行您的应用

从项目的根目录开始，在命令提示符中键入以下内容以在设备上安装并启动您的应用

npm
Yarn

npm run android

yarn android

如果出现“桥接配置不可用”错误，请参阅使用 adb reverse。

提示：您还可以使用 React Native CLI 生成和运行 release 版本（例如，从项目的根目录：yarn android --mode release）。

连接到开发服务器

您还可以通过连接到开发机器上运行的开发服务器，快速迭代设备。有几种方法可以实现此目的，具体取决于您是否有权访问 USB 线缆或 Wi-Fi 网络。

方法 1：使用 adb reverse（推荐）

如果您的设备运行 Android 5.0（棒棒糖）或更高版本、已启用 USB 调试并通过 USB 连接到开发机器，则可以使用此方法。

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

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

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

$ adb devices

您现在可以从Dev 菜单启用快速刷新。只要您的 JavaScript 代码发生更改，您的应用就会重新加载。

方法 2：通过 Wi-Fi 连接

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

确保您的笔记本电脑和手机位于**同一** Wi-Fi 网络上。
在您的设备上打开 React Native 应用。
您会看到带有错误的红色屏幕。这没关系。以下步骤将解决此问题。
打开应用内Dev 菜单。
转到**Dev 设置** → **设备的调试服务器主机和端口**。
输入您机器的 IP 地址和本地开发服务器的端口（例如 10.0.1.1:8081）。
返回**Dev 菜单**并选择**重新加载 JS**。

您现在可以从Dev 菜单启用快速刷新。只要您的 JavaScript 代码发生更改，您的应用就会重新加载。

构建您的应用以供生产

在 iOS 设备上运行您的应用

开发操作系统

macOS
Windows
Linux

1. 通过 USB 连接您的设备

使用 USB 到 Lightning 或 USB-C 线缆将您的 iOS 设备连接到 Mac。导航到项目中的 ios 文件夹，然后使用 Xcode 打开其中的 .xcodeproj 文件，或者如果您使用的是 CocoaPods，则打开 .xcworkspace 文件。

如果这是您第一次在 iOS 设备上运行应用程序，您可能需要注册您的设备以进行开发。从 Xcode 的菜单栏打开**产品**菜单，然后转到**目标设备**。在列表中查找并选择您的设备。然后，Xcode 将注册您的设备以进行开发。

2. 配置代码签名

如果您还没有，请注册一个Apple 开发者帐户。

在 Xcode 项目导航器中选择您的项目，然后选择您的主目标（它应该与您的项目名称相同）。查找“常规”选项卡。转到“签名”并确保在“团队”下拉列表中选择了您的 Apple 开发者帐户或团队。对测试目标执行相同的操作（它以 Tests 结尾，位于主目标下方）。

重复此步骤以针对项目中的测试目标。

3. 构建并运行您的应用程序

如果一切设置正确，您的设备将被列为 Xcode 工具栏中的构建目标，并且它也会出现在设备窗格中（Shift ⇧ + Cmd ⌘ + 2）。您现在可以按下**构建并运行**按钮（Cmd ⌘ + R）或从**产品**菜单中选择**运行**。您的应用程序将很快在您的设备上启动。

如果您遇到任何问题，请查看 Apple 的在设备上启动您的应用程序文档。

连接到开发服务器

您还可以使用开发服务器在设备上快速迭代。您只需要与您的计算机位于同一 Wi-Fi 网络中。摇晃您的设备以打开开发菜单，然后启用快速刷新。每当您的 JavaScript 代码发生更改时，您的应用程序都会重新加载。

故障排除

如果您有任何问题，请确保您的 Mac 和设备位于同一网络中并且可以相互访问。许多带有俘获门户的开放式无线网络配置为阻止设备访问网络上的其他设备。在这种情况下，您可以使用设备的个人热点功能。您还可以通过 USB 将 Mac 的互联网（Wi-Fi/以太网）连接共享到您的设备，并通过此隧道连接到捆绑器，以获得非常高的传输速度。

当尝试连接到开发服务器时，您可能会看到一个带有错误的红色屏幕，显示

连接到 https://127.0.0.1:8081/debugger-proxy?role=client 超时。您是否正在运行节点代理？如果您在设备上运行，请检查 RCTWebSocketExecutor.m 中是否具有正确的 IP 地址。

要解决此问题，请检查以下几点。

1. Wi-Fi 网络

确保您的笔记本电脑和手机位于**同一** Wi-Fi 网络上。

2. IP 地址

确保构建脚本正确检测到您机器的 IP 地址（例如 10.0.1.123）。

打开报告导航器选项卡，选择最后一个构建并搜索 IP= 后跟一个 IP 地址。嵌入到应用程序中的 IP 地址应与您机器的 IP 地址匹配。

构建您的应用程序以供生产使用

您已使用 React Native 构建了一个很棒的应用程序，现在您迫不及待地想将其发布到 App Store。此过程与任何其他原生 iOS 应用程序相同，但需要考虑一些其他事项。请按照发布到 Apple App Store的指南了解更多信息。

构建 iOS 设备的应用程序需要 Mac。或者，您可以参考我们的环境设置指南，了解如何使用 Expo CLI 构建您的应用程序，这将允许您使用 Expo 客户端应用程序运行您的应用程序。

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

开发操作系统​

1. 通过 USB 启用调试​

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

3. 运行您的应用​

连接到开发服务器

方法 1：使用 adb reverse（推荐）​

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

构建您的应用以供生产​

1. 通过 USB 启用调试​

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

3. 运行您的应用​

连接到开发服务器

方法 1：使用 adb reverse（推荐）​

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

构建您的应用以供生产​

1. 通过 USB 启用调试​

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

3. 运行您的应用​

连接到开发服务器

方法 1：使用 adb reverse（推荐）​

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

构建您的应用以供生产​

在 iOS 设备上运行您的应用​

开发操作系统​

1. 通过 USB 连接您的设备​

2. 配置代码签名​

3. 构建并运行您的应用程序​

连接到开发服务器

故障排除​

1. Wi-Fi 网络​

2. IP 地址​

构建您的应用程序以供生产使用​

在 Android 设备上运行您的应用

开发操作系统

1. 通过 USB 启用调试

2. 通过 USB 连接您的设备

3. 运行您的应用

方法 1：使用 adb reverse（推荐）

方法 2：通过 Wi-Fi 连接

构建您的应用以供生产

1. 通过 USB 启用调试

2. 通过 USB 连接您的设备

3. 运行您的应用

方法 1：使用 adb reverse（推荐）

方法 2：通过 Wi-Fi 连接

构建您的应用以供生产

1. 通过 USB 启用调试

2. 通过 USB 连接您的设备

3. 运行您的应用

方法 1：使用 adb reverse（推荐）

方法 2：通过 Wi-Fi 连接

构建您的应用以供生产

在 iOS 设备上运行您的应用

开发操作系统

1. 通过 USB 连接您的设备

2. 配置代码签名

3. 构建并运行您的应用程序

故障排除

1. Wi-Fi 网络

2. IP 地址

构建您的应用程序以供生产使用