跳至主内容
版本:0.79

设置你的环境

非官方测试版翻译

本页面由 PageTurner AI 翻译(测试版)。未经项目官方认可。 发现错误? 报告问题 →

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

备注

本指南需要安装 Android Studio 或 Xcode。如果你已经安装了其中任一程序,只需几分钟即可开始运行。如果尚未安装,预计需要花费一小时左右进行安装和配置。

Is setting up my environment required?

Setting up your environment is not required if you're using a Framework. With a React Native Framework, you don't need to set up Android Studio or Xcode as it will take care of building the native app for you

If you have constraints that prevent you from using a Framework, or you'd like to write your own Framework, then setting up your local environment is a requirement. After your environment is set up, learn how to get started without a framework.

开发操作系统

Target OS

安装依赖项

非官方测试版翻译

本页面由 PageTurner AI 翻译(测试版)。未经项目官方认可。 发现错误? 报告问题 →

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

虽然你可以使用任意编辑器开发应用,但必须安装 Android Studio 才能配置必要的工具链,用于构建 Android 平台的 React Native 应用。

Node

请按照适用于你 Linux 发行版的安装说明安装 Node 18.18 或更高版本。

Java Development Kit

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

Android development environment

如果你是 Android 开发新手,环境配置可能稍显繁琐;若已有经验,则只需调整部分设置。无论哪种情况,都请仔细遵循后续步骤。

1. Install Android Studio

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

  • Android SDK

  • Android SDK Platform

  • Android Virtual Device

点击"Next"安装所有组件。

若复选框呈灰色不可选,后续仍有机会安装这些组件。

安装完成进入欢迎界面后,继续下一步操作。

2. Install the Android SDK

Android Studio 默认安装最新版 Android SDK。但构建包含原生代码的 React Native 应用需特定使用 Android 15 (VanillaIceCream) SDK。其他 Android SDK 可通过 Android Studio 的 SDK 管理器安装。

打开 Android Studio,点击"Configure"(配置)按钮,选择"SDK Manager"(SDK 管理器)。

SDK 管理器也可在 Android Studio 的"Settings"对话框中找到: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" 条目,确保已选中 35.0.0Android SDK Command-line Tools (latest)

最后点击"应用"下载并安装Android SDK及相关构建工具。

3. Configure the ANDROID_HOME environment variable

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 用于 bashsource $HOME/.zprofile 使配置生效。运行 echo $ANDROID_HOME 验证 ANDROID_HOME 是否设置成功,运行 echo $PATH 检查路径是否已添加。

请确保使用正确的Android SDK路径。具体路径可在Android Studio的"Settings"对话框中查看:Languages & FrameworksAndroid SDK

Watchman

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

Watchman 是 Facebook 开发的用于监控文件系统变更的工具。强烈建议安装它以获得更好的性能,并在某些边缘场景中提升兼容性(注意:不安装可能也能运行,但效果因人而异;现在安装可避免后续可能出现的麻烦)。

Preparing the Android device

运行React Native Android应用需要Android设备。您可以使用物理设备,或更常见的Android虚拟设备(Android Virtual Device)在电脑上模拟Android设备。

无论使用哪种方式,都需要准备设备进行开发调试。

Using a physical device

若有物理设备,可通过USB连接电脑后按照说明操作替代AVD。

Using a virtual device

若用Android Studio打开./AwesomeProject/android,可通过工具栏图标打开"AVD管理器"查看可用虚拟设备:

Android Studio AVD Manager

若刚安装Android Studio,可能需要创建新AVD。选择"Create Virtual Device...",任选手机型号点击"Next",然后选择VanillaIceCream API Level 35镜像。

建议在系统中配置虚拟机加速来提升性能。完成配置后,请返回 AVD 管理器。

点击"Next"→"Finish"创建AVD。此时可点击绿色三角按钮启动模拟器。

That's it!

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

Now what?

  • 如需将此 React Native 代码集成到现有应用中,请查阅集成指南

  • 如果您想进一步了解 React Native,请查看 React Native 简介