设置你的环境
本页面由 PageTurner AI 翻译(测试版)。未经项目官方认可。 发现错误? 报告问题 →
在本指南中,你将学习如何设置开发环境,以便能够使用 Android Studio 和 Xcode 运行项目。这将使你能够使用 Android 模拟器和 iOS 模拟器进行开发,在本地构建应用等操作。
本指南需要安装 Android Studio 或 Xcode。如果你已经安装了其中任一程序,几分钟内即可完成配置并运行项目。如果尚未安装,预计需要花费一小时左右进行安装和配置。 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.Is setting up my environment required?
开发操作系统
- macOS
- Windows
- Linux
Target OS
- Android
- iOS
安装依赖项
本页面由 PageTurner AI 翻译(测试版)。未经项目官方认可。 发现错误? 报告问题 →
你需要安装 Node、Watchman、React Native 命令行工具、JDK 以及 Android Studio。
虽然你可以使用任意编辑器开发应用,但必须安装 Android Studio 才能配置必要的工具链,用于构建 Android 平台的 React Native 应用。
Node & Watchman
推荐使用 Homebrew 安装 Node 和 Watchman。安装 Homebrew 后在终端执行以下命令:
brew install node
brew install watchman
若已安装 Node,请确保版本为 20.19.4 或更高。
Watchman 是 Facebook 开发的文件系统监控工具,强烈建议安装以提升性能。
Java Development Kit
推荐通过 Homebrew 安装 Azul Zulu 版 OpenJDK。安装 Homebrew 后在终端执行:
brew install --cask zulu@17
# Get path to where cask was installed to find the JDK installer
brew info --cask zulu@17
# ==> zulu@17: <version number>
# https://www.azul.com/downloads/
# Installed
# /opt/homebrew/Caskroom/zulu@17/<version number> (185.8MB) (note that the path is /usr/local/Caskroom on non-Apple Silicon Macs)
# Installed using the formulae.brew.sh API on 2024-06-06 at 10:00:00
# Navigate to the folder
open /opt/homebrew/Caskroom/zulu@17/<version number> # or /usr/local/Caskroom/zulu@17/<version number>
在 Finder 中双击 Double-Click to Install Azul Zulu JDK 17.pkg 安装包完成 JDK 安装。
JDK 安装完成后,在 ~/.zshrc(或 ~/.bash_profile)中添加或更新 JAVA_HOME 环境变量。
若按上述步骤操作,JDK 通常位于以下路径:/Library/Java/JavaVirtualMachines/zulu-17.jdk/Contents/Home
export JAVA_HOME=/Library/Java/JavaVirtualMachines/zulu-17.jdk/Contents/Home
Zulu OpenJDK 提供同时支持 Intel 和 M1 芯片的 Mac 版本,可确保在 M1 Mac 上获得比 Intel 版 JDK 更快的构建速度。
若已安装 JDK,建议使用 JDK 17 版本,更高版本可能导致兼容性问题。
Android development environment
如果你是 Android 开发新手,环境配置可能稍显繁琐;若已有经验,则只需调整部分设置。无论哪种情况,都请仔细遵循后续步骤。
1. Install Android Studio
下载并安装 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,点击"More Actions"按钮,选择"SDK Manager"。

SDK 管理器也可在 Android Studio 的"设置"对话框中找到:Languages & Frameworks → Android SDK。
在 SDK 管理器中选择"SDK Platforms"标签页,勾选右下角的"Show Package Details"。找到并展开 Android 15 (VanillaIceCream) 条目,确保勾选以下项目:
-
Android SDK Platform 35 -
Intel x86 Atom_64 System Image或Google APIs Intel x86 Atom System Image(Apple M1 芯片选择Google APIs ARM 64 v8a System Image)
接下来,选择"SDK Tools"标签页,同样勾选"Show Package Details"旁边的复选框。找到并展开"Android SDK Build-Tools"条目,确保选中 36.0.0 和 Android SDK Command-line Tools (latest)。
最后点击"应用"下载并安装Android SDK及相关构建工具。
3. Configure the ANDROID_HOME environment variable
React Native工具需要设置环境变量才能构建包含原生代码的应用。
将以下配置添加到~/.zprofile或~/.zshrc中(若使用bash则添加到~/.bash_profile或~/.bashrc):
export ANDROID_HOME=$HOME/Library/Android/sdk
export PATH=$PATH:$ANDROID_HOME/emulator
export PATH=$PATH:$ANDROID_HOME/platform-tools
执行source ~/.zprofile(bash用户执行source ~/.bash_profile)使配置生效。通过echo $ANDROID_HOME验证环境变量是否设置成功,并通过echo $PATH检查路径是否正确添加。
请确保使用正确的 Android SDK 路径。您可以在 Android Studio 的"设置"对话框中查看实际路径:Languages & Frameworks → Android SDK。
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。选择"Create Virtual Device...",任选手机型号点击"Next",然后选择VanillaIceCream API Level 35镜像。
点击"Next"→"Finish"创建AVD。此时可点击绿色三角按钮启动模拟器。
That's it!
恭喜!您已成功搭建开发环境。

Now what?
-
如需将此 React Native 代码集成到现有应用中,请查阅集成指南。
-
如果您想进一步了解 React Native,请查看 React Native 简介。
安装依赖项
本页面由 PageTurner AI 翻译(测试版)。未经项目官方认可。 发现错误? 报告问题 →
你需要安装 Node、Watchman、React Native 命令行工具、Xcode 和 CocoaPods。
虽然你可以使用任何编辑器开发应用,但必须安装 Xcode 才能配置构建 React Native iOS 应用所需的工具。
Node 与 Watchman
推荐使用 Homebrew 安装 Node 和 Watchman。安装 Homebrew 后在终端执行以下命令:
brew install node
brew install watchman
若已安装 Node,请确保版本为 20.19.4 或更高。
Watchman 是 Facebook 开发的文件系统监控工具,强烈建议安装以提升性能。
Xcode
请使用 Xcode 的最新版本。
推荐通过 Mac App Store 安装 Xcode。安装 Xcode 时会同时安装 iOS 模拟器和构建 iOS 应用所需的所有工具。
命令行工具
还需安装 Xcode 命令行工具。打开 Xcode,选择顶部菜单的 Settings... (或 Preferences...),进入 Locations 面板,在 Command Line Tools 下拉菜单中选择最新版本安装。

在 Xcode 中安装 iOS 模拟器
打开 Xcode > Settings... (或 Preferences...),选择 Platforms (或 Components) 标签页,选取所需 iOS 版本的模拟器。
若使用 Xcode 14.0 或更高版本,请打开 Xcode > Settings > Platforms 标签页,点击"+"图标并选择 iOS… 选项。
CocoaPods
CocoaPods 是 iOS 的依赖管理工具,属于 Ruby gem。可通过最新版 macOS 自带的 Ruby 安装 CocoaPods。
更多信息请参阅 CocoaPods 入门指南。
[可选] 环境配置
从 React Native 0.69 版本开始,可使用模板提供的 .xcode.env 文件配置 Xcode 环境。
.xcode.env 文件包含导出 node 可执行文件路径的 NODE_BINARY 环境变量。
这是推荐方案,可将构建基础设施与系统版 node 解耦。若路径不同默认值,请使用自定义路径或 node 版本管理器修改该变量。
此外,还可添加其他环境变量,并在构建脚本阶段引入 .xcode.env 文件。若需运行依赖特定环境的脚本,此推荐方案可将构建阶段与环境解耦。
That's it!
恭喜!您已成功搭建开发环境。

Now what?
-
如需将此 React Native 代码集成到现有应用中,请查阅集成指南。
-
如果您想进一步了解 React Native,请查看 React Native 简介。
Target OS
- Android
- iOS
本页面由 PageTurner AI 翻译(测试版)。未经项目官方认可。 发现错误? 报告问题 →
Installing dependencies
你需要安装 Node、React Native 命令行工具、JDK 和 Android Studio。
虽然你可以使用任意编辑器开发应用,但必须安装 Android Studio 才能配置必要的工具链,用于构建 Android 平台的 React Native 应用。
Node, JDK
我们推荐通过 Chocolatey 安装 Node,这是 Windows 上流行的包管理器。
建议使用 Node 的 LTS 版本。若需切换不同版本,可考虑通过 nvm-windows 安装 Node,这是 Windows 的 Node 版本管理工具。
React Native 还需要安装 Java SE 开发工具包 (JDK),同样可通过 Chocolatey 安装。
以管理员身份打开命令提示符(右键点击命令提示符并选择"以管理员身份运行"),然后执行以下命令:
choco install -y nodejs-lts microsoft-openjdk17
若系统中已安装 Node,请确保版本为 20.19.4 或更高。若已安装 JDK,我们推荐使用 JDK17。使用更高版本的 JDK 可能导致问题。
你可以在 Node 的下载页面 找到其他安装选项。
若使用最新版 Java 开发工具包,需调整项目的 Gradle 版本以兼容 JDK。请打开 {project root folder}\android\gradle\wrapper\gradle-wrapper.properties 文件,修改 distributionUrl 值升级 Gradle 版本。可在此处查看 Gradle 的最新发行版。
Android development environment
如果你是 Android 开发新手,环境配置可能稍显繁琐;若已有经验,则只需调整部分设置。无论哪种情况,都请仔细遵循后续步骤。
1. Install Android Studio
下载并安装 Android Studio。在 Android Studio 安装向导中,请确保勾选以下所有项目:
-
Android SDK -
Android SDK Platform -
Android Virtual Device -
若未使用 Hyper-V:需勾选
Performance (Intel ® HAXM)(AMD 或 Hyper-V 用户参考此说明)
点击"Next"安装所有组件。
若复选框呈灰色不可选状态,稍后仍有安装这些组件的机会。
安装完成进入欢迎界面后,继续下一步操作。
2. Install the Android SDK
Android Studio 默认安装最新版 Android SDK。但构建包含原生代码的 React Native 应用需特定使用 Android 15 (VanillaIceCream) SDK。其他 Android SDK 可通过 Android Studio 的 SDK 管理器安装。
打开 Android Studio,点击"More Actions"按钮,选择"SDK Manager"。

SDK 管理器也可在 Android Studio 的"设置"对话框中找到:Languages & Frameworks → Android SDK。
在 SDK 管理器中选择"SDK Platforms"标签页,勾选右下角的"Show Package Details"。找到并展开 Android 15 (VanillaIceCream) 条目,确保勾选以下项目:
-
Android SDK Platform 35 -
Intel x86 Atom_64 System Image或Google APIs Intel x86 Atom System Image
接着选择"SDK Tools"标签页,同样勾选"Show Package Details"。找到并展开 Android SDK Build-Tools 条目,确保选中 36.0.0 和 Android SDK Command-line Tools (latest)。
最后点击"应用"下载并安装Android SDK及相关构建工具。
3. Configure the ANDROID_HOME environment variable
React Native工具需要设置环境变量才能构建包含原生代码的应用。
-
打开Windows控制面板
-
点击用户账户,然后再次点击用户账户
-
点击更改我的环境变量
-
点击**新建...**创建名为
ANDROID_HOME的用户变量,指向Android SDK路径:
默认安装路径如下:
%LOCALAPPDATA%\Android\Sdk
您可以在Android Studio的"设置"对话框中查看实际SDK路径:Languages & Frameworks → Android SDK。
请打开新的命令提示符窗口,确保新环境变量生效后再继续下一步。
-
打开PowerShell
-
复制粘贴 Get-ChildItem -Path Env:\ 到PowerShell
-
验证
ANDROID_HOME是否已添加
4. Add platform-tools to Path
-
打开Windows控制面板
-
点击用户账户,然后再次点击用户账户
-
点击更改我的环境变量
-
选择Path变量
-
点击编辑
-
点击新建并添加platform-tools的路径
默认路径为:
%LOCALAPPDATA%\Android\Sdk\platform-tools
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。选择"Create Virtual Device...",任选手机型号点击"Next",然后选择VanillaIceCream API Level 35镜像。
若未安装 HAXM,请点击"Install HAXM"或按此说明操作,完成安装后返回 AVD 管理器。
点击"Next"→"Finish"创建AVD。此时可点击绿色三角按钮启动模拟器。
That's it!
恭喜!您已成功搭建开发环境。

Now what?
-
如需将此 React Native 代码集成到现有应用中,请查阅集成指南。
-
如果您想进一步了解 React Native,请查看 React Native 简介。
Target OS
- Android
- iOS
安装依赖项
本页面由 PageTurner AI 翻译(测试版)。未经项目官方认可。 发现错误? 报告问题 →
你需要安装 Node、React Native 命令行工具、JDK 和 Android Studio。
虽然你可以使用任意编辑器开发应用,但必须安装 Android Studio 才能配置必要的工具链,用于构建 Android 平台的 React Native 应用。
Node
请按照 你的 Linux 发行版安装说明 安装 Node 20.19.4 或更高版本。
Java Development Kit
React Native 当前推荐使用 Java SE 开发工具包(JDK)17 版本。使用更高版本的 JDK 可能会遇到问题。你可以从 AdoptOpenJDK 下载安装 OpenJDK,或通过系统包管理器安装。
Android development environment
如果你是 Android 开发新手,环境配置可能稍显繁琐;若已有经验,则只需调整部分设置。无论哪种情况,都请仔细遵循后续步骤。
1. Install Android Studio
下载并安装 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 的"设置"对话框中找到:Languages & Frameworks → Android SDK。
在 SDK 管理器中选择"SDK Platforms"标签页,勾选右下角的"Show Package Details"。找到并展开 Android 15 (VanillaIceCream) 条目,确保勾选以下项目:
-
Android SDK Platform 35 -
Intel x86 Atom_64 System Image或Google APIs Intel x86 Atom System Image
接下来,选择"SDK Tools"标签页,同样勾选"Show Package Details"旁边的复选框。找到并展开"Android SDK Build-Tools"条目,确保选中 36.0.0 和 Android SDK Command-line Tools (latest)。
最后点击"应用"下载并安装Android SDK及相关构建工具。
3. Configure the ANDROID_HOME environment variable
React Native工具需要设置环境变量才能构建包含原生代码的应用。
将以下内容添加到 $HOME/.bash_profile 或 $HOME/.bashrc(若使用 zsh 则为 ~/.zprofile 或 ~/.zshrc)配置文件:
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 使配置生效。运行 echo $ANDROID_HOME 验证 ANDROID_HOME 是否设置成功,运行 echo $PATH 检查路径是否已添加。
请确保使用正确的 Android SDK 路径。您可以在 Android Studio 的"设置"对话框中查看实际路径:Languages & Frameworks → Android 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。选择"Create Virtual Device...",任选手机型号点击"Next",然后选择VanillaIceCream API Level 35镜像。
建议配置 VM 加速以提升性能。完成配置后请返回 AVD 管理器。
点击"Next"→"Finish"创建AVD。此时可点击绿色三角按钮启动模拟器。
That's it!
恭喜!您已成功搭建开发环境。

Now what?
-
如需将此 React Native 代码集成到现有应用中,请查阅集成指南。
-
如果您想进一步了解 React Native,请查看 React Native 简介。