React Native环境搭建——Android

一、Android环境搭建

根据官网:搭建开发环境 · React Native 中文网,必须安装的依赖有:Node、JDK 和 Android Studio。

1、安装Homebrew

2、安装node、npm

3、安装 Watchman 的工具

前三步参考:React Native 环境搭建_爱踢球的小前端的博客-CSDN博客

4、安装 JDK

安装 Java Development Kit(JDK),搭建 Java 开发环境。

众所周知,Android 依赖 Java 开发环境,这里我们搭建 Java 环境使用的工具是 Zulu。

Zulu 是一款 Java 运行环境,它是基于 OpenJDK(一个 Java 编程语言的开源实现的源代码)构建的。Zulu 提供了 Intel 和 M1 Mac 的 JDK,这使得 JDK 的安装更为方便。

由于 Zulu 是一个图形界面程序,需要手动安装,为了方便这里我们借助 Cask 一键安装。你需要先借助 Homebrew 安装 Cask 再安装 Zulu。命令如下:

brew tap homebrew/cask-versions

brew install --cask zulu11

安装成功后,可以运行 java --version 检查 Java 运行时环境(JRE)的版本,或运行 javac --version 检查 Java 开发工具包(JDK)中 Java 编译器(javac)的版本。

5、安装Android Studio

官网:https://developer.android.com/studio

Android Studio是搭建 Android 开发环境的前提条件。

需要安装 Android Studio 才能在本机构建 React Native 应用程序,并运行在真机或模拟器上。你可以从 Android Studio 官方网站下载和安装 Android Studio。

在 Android Studio 安装向导中,选择默认选项并设置相关镜像安装默认依赖即可。

6、安装Android SDK

上一步中,我们已经把 Android Studio 和默认依赖安装好了。打开后快捷键command+,打开preferences

除了默认依赖,你还需要安装:

Android SDK Platform 33Intel x86 Atom_64 System Image

或 Google APIs Intel x86 Atom System Image(Inter CPU)

或 Google APIs ARM 64 v8a System Image (Apple CPU)Android SDK Build-Tools 33.0.0 版本安装的第一部分的是 Android SDK Platform。

它是指针对 Android 特定版本的 Android 平台组件,包括库、工具和框架等。

安装的第二部分的是 System Image。它是针对特定处理器架构的 Android 系统镜像,该镜像主要用于在模拟器上模拟具有特定 CPU 和 Google API 的 Android 设备。带有 Intel 字样的适配的是 Intel CPU,带有 ARM 字样的适配的是苹果 CPU,此外带有 Google 字样表示集成了 Google 的 API。一般情况下,Intel CPU 选择 Google APIs Intel x86 Atom System Image,苹果 CPU 选择 Google APIs ARM 64 v8a System Image。

安装的第三部分是 Android SDK Build-Tools,你可以在 Android Studio 的左上角找到 Preference,并打开它。然后搜索 Android SDK,找到其中的 SDK Platforms 和 SDK Tools 配置页,然后按下图所示勾选,最后点击 Apply 完成相关项的安装。

7、配置 Android 环境变量

后续操作会依赖于一些命令行,因此你还需要将 Android 环境变量暴露到全局,以便使用。

Zsh(Z shell)和 Bash(Bourne Again SHell)是两种不同的命令工具,你可以运行如下命令检查你用的是哪种工具。

echo $SHELL

我这里是 /bin/zsh 需要修改 ~/.zprofile 或 ~/.zshrc 文件,使用自带的 vi 编辑器进行编辑,命令如下:

vi ~/.zshrc

接着,按 i 键进入插入模式,再使用箭头键将光标移动到插入文本的位置,然后将下列内容复制粘贴到文本中:

export ANDROID_HOME=$HOME/Library/Android/sdk

export PATH=$PATH:$ANDROID_HOME/emulator

export PATH=$PATH:$ANDROID_HOME/platform-tools

完成插入后,按 Esc 键退出插入模式,输入 :wq 以保存更改并退出 vi 编辑器。重启终端(Shell)或者运行 source ~/.zshrc 使配置生效。

最后,运行如下命令检查 Android 环境变量是否设置成功。

echo $ANDROID_HOME

/Users/jianghongwei/Library/Android/sdk

echo $PATH

/Users/local/bin...

8、安装 Android 模拟器

安装 Android 模拟器是搭建 Android 环境中的最后一步。当然你可以使用真机进行调试,但是模拟器大多数情况下更加方便。

如果你还在 Welcome to Android Studio 页面,那么你可以在 More Actions 下拉框中选择 Virtual Device Manager。其他情况,你可以在顶部菜单栏中点击 Tools > Virtual Device Manager。

在 Device Manager 界面中,点击 Create Virtual Device 按钮创建虚拟设备。

在 Virtual Device Configuration 页面选择虚拟硬件,你可以选择任意一个设备,比如 Pixel XL,然后点击 Next。

接着进入到 Virtual Device Configuration 页面的 System Image 系统镜像选择步骤,选择模拟器的 Android 版本,然后点击下载按钮进行下载。

现在已成功创建了一个新的 Android 模拟器。

回到 Device Manager 页面后,你将看到新创建的模拟器设备。点击 Actions 中的播放图标 ▶️ 启动模拟器。接着会自动打开一个模拟器,并加载所选的 Android 系统镜像。

看到 Android 操作系统界面时,你的模拟器就安装完成了。

Android 环境已经搭建完成。

9、运行React Native 项目

你也可以在 Android Studio 中直接运行应用,打开Android目录下的 build.gradle 文件,播放图标 ▶️ 启动模拟器。