新手教程-使用 Android Studio 搭建 React Native 项目开发环境

过油肉拌面
383 阅读1分钟

新手使用 Android Studio 开发 React Native 项目教程

  1. 配置Java环境 React Native 项目需要 Java 环境来构建 Android 项目。建议可以跟同事保持一致版本如果是老项目的话

    1. 使用 Homebrew 安装 Java

      打开终端，使用 Homebrew 安装 Java ：

    brew install openjdk@xx

    2. 配置 Java 环境变量

      安装完 Java 后，你需要设置 Java 环境变量：

    1. 打开 ~/.zshrc 文件进行编辑：
    nano ~/.zshrc
    1. 在文件中添加以下内容：
    export JAVA_HOME=$(/usr/libexec/java_home -v 17)
export PATH=
$JAVA_HOME/bin:$
PATH
    1. 保存并退出编辑器，然后使更改生效：
    source ~/.zshrc

    3. 验证 Java 安装

      使用以下命令验证 Java 版本：

    java -version

      如果安装正确，你应该看到 Java 17 的版本信息。

  1. 安装 Android Studio 和 模拟器

      从 Android Studio 官网 下载并安装 Android Studio。

      安装步骤：

    1. 下载并安装 Android Studio。
    2. 在首次启动时，Android Studio 会提示你安装一些必要的组件（如 Android SDK、Android 虚拟设备等）。
    3. 完成安装后，打开 Android Studio 并配置默认 Android SDK 路径。

      安装 Android 模拟器

      Android Studio 自带了 AVD（Android Virtual Device）管理工具，允许你创建并运行虚拟 Android 设备。请按照以下步骤创建并启动模拟器：

    1. 在 Android Studio 中，点击工具栏的 AVD Manager（Android Virtual Device 管理器）。
    2. 点击 Create Virtual Device 创建新的虚拟设备。
    3. 选择设备型号、系统镜像等选项，创建模拟器。
    4. 启动模拟器，确保其正常工作。

  1. 安装SDK 和 Tools

      如果你希望手动安装 SDK 或工具，可以按以下步骤操作。

    1. 安装 Android SDK

      在 Android Studio 中，默认情况下 SDK 会随 Android Studio 一起安装。如果你需要手动安装或更新 SDK，请按照以下步骤操作：

    1. 打开 Android Studio。

    2. 路径 Settings | Languages & Frameworks | Android SDK，见图。

    3. 在 SDK 管理器中，选择并安装所需的 SDK 版本和工具（如 SDK Platform 和 Android Build Tools）。

    1. 安装 SDK Command Line Tools

      1.     同上一步可以在 Settings | Languages & Frameworks | Android SDK中进行勾选安装
      2.     （也可以手动到官网安装放置到本地sdk目录下）
      3. 访问 SDK Downloads 页面。
      4. 下载适用于 macOS 的 Command Line Tools。
      5. 将下载的工具解压并放置到 Android SDK 目录下。

  1. 配置环境变量

    1. 设置 ANDROID_HOME 环境变量

      1.     确保 Android SDK 已正确安装并配置了 ANDROID_HOME 环境变量。此步骤确保你的开发工具能够找到 Android SDK。

      2.     步骤：

      3. 找到 Android SDK 的安装路径并切入。通常，如果你通过 Android Studio 安装 SDK，默认路径为：

        1. macOS: /Users/<your-username>/Library/Android/sdk

      4. 设置 ANDROID_HOME 环境变量。在终端中，编辑 ~/.zshrc 文件（如果使用的是 Zsh），或者编辑 ~/.bash_profile（如果使用的是 Bash）。

        1. 使用以下命令打开 ~/.zshrc 文件：
        2.  nano ~/.zshrc
        3. 在文件末尾添加以下内容（请替换 <your-username> 为你的用户名）：
        4.  export PATH="/opt/homebrew/opt/openjdk@17/bin:$PATH"
 export ANDROID_HOME=/Users/<your-username>/Library/Android/sdk
 export PATH=
 $ANDROID_HOME/tools:$
 ANDROID_HOME/platform-tools:$PATH
 export PATH=$ANDROID_HOME/cmdline-tools/latest/bin:$PATH
        5. 保存并退出编辑器后，使修改生效：
        6.  source ~/.zshrc

    2. 配置 sdk.dir 在 local.properties 文件中

      1.     在你的 React Native 项目的 android 目录下，编辑或创建 local.properties 文件，确保其包含正确的 SDK 路径。

      2.     步骤：

      3. 在 android 目录中找到 local.properties 文件（如果文件不存在，可以手动创建）。

      4. 打开并编辑 local.properties 文件：

      5.  nano android/local.properties

      6. 在文件中添加以下行：

        1.  sdk.dir=/Users/<your-username>/Library/Android/sdk
        2.       确保替换 <your-username> 为你的用户名。

    3. 验证 Android SDK 是否正确安装

      1.     使用以下命令验证 Android SDK 是否已正确安装：
      2.  android-sdk --version
      3.     如果 SDK 安装正常，你应该会看到版本信息。

  1. 完成环境配置后运行项目

  • 你可以重新运行项目：
pnpm run android
  • 如果一切设置正确，你应该能看到项目在 Android 模拟器或连接的 Android 设备上运行
avatar
文章
阅读
粉丝