跳到主要内容

设置你的开发环境

在本指南中,你将学习如何设置开发环境,以便使用 Android Studio 和 Xcode 运行你的项目。这将允许你使用 Android 模拟器和 iOS 模拟器进行开发,本地构建你的应用等等。

信息

本指南需要安装 Android Studio 或 Xcode。如果你已经安装了其中一个程序,你应该能在几分钟内完成准备工作。如果尚未安装,你需要花约一小时进行安装和配置。

是否必须设置环境?

如果你使用的是 Framework,则不必设置环境。使用 React Native Framework 时,无需安装 Android Studio 或 Xcode,框架会帮你构建原生应用。

如果你受限而不能使用 Framework,或者希望自己编写 Framework,那么设置本地环境就是必需的。环境搭建完成后,可以学习如何不使用框架开始开发

开发操作系统

目标操作系统

安装依赖

你需要安装 Node、React Native 命令行工具、JDK 和 Android Studio。

虽然你可以使用任意编辑器来开发你的应用,但你需要安装 Android Studio 来搭建构建 React Native 安卓应用所需的工具链。

Node

按照 你的 Linux 发行版的安装说明 安装 Node 20.19.4 或更高版本。

Java 开发工具包

React Native 当前推荐使用 Java SE 开发工具包(JDK)版本 17。使用更高版本的 JDK 可能会遇到问题。你可以从 AdoptOpenJDK 或通过你的系统包管理器下载并安装 OpenJDK

安卓开发环境

如果你是安卓开发新手,搭建开发环境可能会比较繁琐。如果你已经熟悉安卓开发,可能只需配置好一些内容。无论哪种情况,请务必仔细按照接下来的步骤操作。

1. 安装 Android Studio

下载并安装 Android Studio。在安装向导中,确保勾选以下所有组件:

  • Android SDK
  • Android SDK Platform
  • Android Virtual Device

然后点击“下一步”安装所有组件。

备注

如果这些复选框是灰色不可选,后续安装时你仍有机会安装这些组件。

安装完成并显示欢迎界面后,继续下一步。

2. 安装 Android SDK

Android Studio 默认安装最新 Android SDK。但是,构建带原生代码的 React Native 应用需要特定版本的 Android 15 (VanillaIceCream) SDK。你可以通过 Android Studio 中的 SDK 管理器安装额外的 Android SDK。

操作方法:打开 Android Studio,点击“Configure”按钮,选择“SDK Manager”。

提示

SDK 管理器也可以在 Android Studio “设置”对话框中找到,路径是 Languages & FrameworksAndroid SDK

在 SDK 管理器中选择“SDK Platforms”标签,然后在右下角勾选“Show Package Details”。找到并展开 Android 15 (VanillaIceCream) 条目,确保选中以下项目:

  • Android SDK Platform 35
  • Intel x86 Atom_64 System ImageGoogle APIs Intel x86 Atom System Image

接着选择“SDK Tools”标签,同样勾选“Show Package Details”。找到并展开“Android SDK Build-Tools”,确保选择了 36.0.0Android SDK Command-line Tools (latest)

最后点击“Apply”下载并安装安卓 SDK 及相关构建工具。

3. 配置 ANDROID_HOME 环境变量

React Native 工具需要设置一些环境变量以构建带原生代码的应用。

在你的 $HOME/.bash_profile$HOME/.bashrc(如果使用 zsh 则是 ~/.zprofile~/.zshrc)配置文件中添加以下内容:

shell
export ANDROID_HOME=$HOME/Android/Sdk
export PATH=$PATH:$ANDROID_HOME/emulator
export PATH=$PATH:$ANDROID_HOME/platform-tools
备注

.bash_profile 是针对 bash 的。如果你使用的是其他 shell,需要编辑相应的 shell 配置文件。

输入 source $HOME/.bash_profile(bash),或 source $HOME/.zprofile 加载配置到当前 shell。运行 echo $ANDROID_HOME 验证 ANDROID_HOME 是否设置成功,运行 echo $PATH 确认相关目录已加入路径。

备注

请确保使用了正确的 Android SDK 路径。你可以在 Android Studio “设置”对话框中查看实际路径,路径是 Languages & FrameworksAndroid SDK

Watchman

按照 Watchman 安装指南 从源码编译安装 Watchman。

信息

Watchman 是 Facebook 开发的文件系统变化监听工具。强烈建议安装它,以提升性能并增强在某些边缘情况下的兼容性(换句话说,你可能可以不用安装,但体验会有所不同;现在安装可避免未来遇到麻烦)。

准备安卓设备

你需要一个安卓设备来运行 React Native 安卓应用。可以是实体设备,也可以更常见地使用安卓虚拟设备(AVD)在电脑上模拟。

无论哪种方式,都需要准备设备以便开发环境运行安卓应用。

使用实体设备

如果你拥有实体安卓设备,可以通过 USB 连接电脑,在 这里 按照说明进行设置,替代 AVD 进行开发。

使用虚拟设备

如果你使用 Android Studio 打开 ./AwesomeProject/android,可以通过 Android Studio 中的 “AVD Manager” 查看已有的安卓虚拟设备列表。找到下图所示的图标:

Android Studio AVD Manager

如果刚安装完 Android Studio,可能需要 创建新的 AVD。点击“Create Virtual Device...”,选择任一手机型号,点击“Next”,选择 VanillaIceCream API 级别 35 的镜像。

提示

推荐配置 虚拟机加速 以提升性能。完成配置后,返回 AVD 管理器继续操作。

点击“Next”然后“Finish”完成 AVD 创建。此时你应该能点击 AVD 旁的绿色三角按钮启动虚拟设备。

完成了!

恭喜你!开发环境搭建成功。

接下来?