Android | 配置并运行React Native项目

环境说明

• 主机环境：Windows 11 家庭版 21H2 版本
• 主机操作系统版本：22000.348
• Android Studio 版本：Electric Eel | 2022.1.1 Patch 1
• Node.JS 版本：v18.6.0
• JDK 版本：openjdk 11.0.19 2023-04-18
• App 调试运行环境：HUAWEI HarmonyOS 3.0.0
• 参考：https://reactnative.cn/docs/environment-setup

开发环境配置

必须包含的依赖有 Node、JDK、Android Studio。上述开发环境配置在这里仅作简要阐述，不作详细说明，相关配置问题请查询相关资料。

Node.js

https://nodejs.org/zh-cn

官网下载地址如上，下载对应操作系统安装包安装即可。
推荐安装 Yarn 工具包，在命令行下输入如下指令安装，可代替 npm 功能。

npm install -g yarn

JDK

https://www.oracle.com/java/technologies/downloads/

官网下载地址如上，下载对应操作系统的Java版本并安装，React-Native 推荐使用的版本为11+。安装完成后配置相关环境变量，进入“此电脑-属性-高级系统设置-高级-环境变量”，新建 JAVA_HOME 系统变量，变量值为安装的 jdk 路径，并在 Path 变量中添加如下路径:

%JAVA_HOME%\bin
%JAVA_HOME%\jre\bin

由于在 JDK11 之后 JRE 集成进 JDK 中，如果需要配置 JRE 路径，需要进入 JDK 安装路径下执行下述指令封装专用 JRE 目录：

bin\jlink.exe --module-path jmods --add-modules java.desktop --output jre

Android Studio

https://developer.android.google.cn/studio

官网下载地址如上，下载后安装即可。第一次进入会有相关配置，无特殊需求默认即可。接着会有选择 SDK 安装位置，等待安装并结束。结束后配置环境变量，新建系统变量 ANDROID_HOME，路径选择 SDK 安装位置，然后在 Path 变量中添加如下路径：

%ANDROID_HOME%\platform-tools  
%ANDROID_HOME%\emulator  
%ANDROID_HOME%\tools  
%ANDROID_HOME%\tools\bin

React Native 项目创建

在指定目录中使用 React Native 内建命令行工具创建名为 AwesomeProject 的新项目：

npx react-native init AwesomeProject

如果需要选择指定版本或项目模板可以使用如下指令：

# 指定版本号 需精确到如下版本
npx react-native init AwesomeProject --version X.XX.X

# 指定项目模板 如带 TypeScript 配置版本
npx react-native init AwesomeTSProject --template react-native-template-typescript

编译并运行

进入刚创建的 AwesomeProject 项目目录，即可通过指令编译运行，需要运行模拟器或连接真机调试运行：

yarn android

# 或使用如下指令
yarn react-na