手把手搭建React Native 到创建运行第一个项目

目标操作系统

安卓

iOS系统

安装依赖项

您将需要 Node、Watchman、React Native 命令行界面、JDK 和 Android Studio。

虽然您可以使用您选择的任何编辑器来开发应用程序，但您需要安装 Android Studio 才能设置必要的工具来构建适用于 Android 的 React Native 应用程序。

节点与守望者

我们建议使用Homebrew安装 Node 和 Watchman 。安装 Homebrew 后在终端中运行以下命令：

brew install node

brew install watchman

如果您已在系统上安装 Node，请确保它是 Node 18 或更高版本。

Watchman是 Facebook 的一个工具，用于监视文件系统的变化。强烈建议您安装它以获得更好的性能。

Java开发套件

我们建议使用Homebrew安装名为 Azul Zulu的 OpenJDK 发行版。安装 Homebrew 后在终端中运行以下命令：

brew tap homebrew/cask-versions

brew install --cask zulu17

# Get path to where cask was installed to double-click installer

brew info --cask zulu17

安装 JDK 后，更新JAVA_HOME环境变量。如果您使用上述步骤，JDK 可能会位于/Library/Java/JavaVirtualMachines/zulu-17.jdk/Contents/Home

Zulu OpenJDK 发行版为Intel 和 M1 Mac提供 JDK 。与使用基于 Intel 的 JDK 相比，这将确保您在 M1 Mac 上的构建速度更快。

如果您的系统上已经安装了 JDK，我们建议您使用 JDK 17。使用更高版本的 JDK 可能会遇到问题。

配置ANDROID_HOME环境变量 Java环境变量 jdk (Version supported: >= 17 <= 20  我这里配置的是17 )
1. open .bash_profile  打开文件  not found 请自行创建

 export ANDROID_HOME=$HOME/Library/Android/sdk

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

export PATH=$PATH:$ANDROID_HOME/tools

export PATH=$PATH:$ANDROID_HOME/tools/bin

export PATH=$PATH:$ANDROID_HOME/emulator
## java 环境
export JAVA_HOME=/Library/Java/JavaVirtualMachines/jdk-17.0.9.jdk/Contents/Homeexport JAVA_17_HOME=/Library/Java/JavaVirtualMachines/jdk-17.0.9.jdk/Contents/Home

2.配置保存完成之后 输入：source ~/.bash_profile  生效  

创建一个新React Native应用程序

React Native 有一个内置的命令行界面，您可以使用它来生成新项目。npx您无需使用Node.js 附带的全局安装任何东西即可访问它。让我们创建一个名为“AwesomeProject”的新 React Native 项目：

npx react-native@latest init AwesomeProject

运行项目

npm run android   

//上述命令报错可以使用 下方命令运行

npm start

写在最后：如报错  请执行：npx react-native doctor   自动检测报错点 并逐一解决

坑： 我这边正确配置Android环境变量 后仍然报错 ANDROID_HOME问题 ，  需在Android studio > Terminal 下输入命令 “source ~/.bash_profile” 才真正生效    终端不生效，有知道原因的烦请告知下 谢谢