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

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

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

  1. 使用 Homebrew 安装 Java

打开终端,使用 Homebrew 安装 Java :

css 复制代码
brew install openjdk@xx
  1. 配置 Java 环境变量

安装完 Java 后,你需要设置 Java 环境变量:

  1. 打开 ~/.zshrc 文件进行编辑:
bash 复制代码
nano ~/.zshrc
  1. 在文件中添加以下内容:
bash 复制代码
export JAVA_HOME=$(/usr/libexec/java_home -v 17)
export PATH=
$JAVA_HOME/bin:$
PATH
  1. 保存并退出编辑器,然后使更改生效:
bash 复制代码
source ~/.zshrc
  1. 验证 Java 安装

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

复制代码
   java -version

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

安装 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. 启动模拟器,确保其正常工作。

安装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. 设置 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 文件:
      bash 复制代码
       nano ~/.zshrc
      1. 在文件末尾添加以下内容(请替换 <your-username> 为你的用户名):
      bash 复制代码
       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
      1. 保存并退出编辑器后,使修改生效:
      bash 复制代码
       source ~/.zshrc
  2. 配置 sdk.dirlocal.properties 文件中

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

    2. 步骤:

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

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

    bash 复制代码
     nano android/local.properties
    1. 在文件中添加以下行:

      javascript 复制代码
       sdk.dir=/Users/<your-username>/Library/Android/sdk
      1. 确保替换 <your-username> 为你的用户名。
  3. 验证 Android SDK 是否正确安装

    1. 使用以下命令验证 Android SDK 是否已正确安装:
    css 复制代码
     android-sdk --version
    1. 如果 SDK 安装正常,你应该会看到版本信息。

完成环境配置后运行项目

  • 你可以重新运行项目:
arduino 复制代码
pnpm run android
  • 如果一切设置正确,你应该能看到项目在 Android 模拟器或连接的 Android 设备上运行
相关推荐
Ai_easygo1 小时前
AI Agent开发入门——从ReAct到Tool Calling,拆解Agent的底层运行逻辑
前端·人工智能·react.js
研☆香1 小时前
分析制作html页面,如何划分页面结构
前端
kyriewen1 小时前
我扒了最近的前端面经——2026年面试不背八股文了,考这5样
前端·面试·ai编程
IT_陈寒2 小时前
Redis的持久化配置把我坑惨了:你以为数据安全了?
前端·人工智能·后端
小徐_23332 小时前
uni-app 项目别再从零搭了!3 个 Wot UI 起手模板怎么选?
前端·uni-app
赵庆明老师3 小时前
Vben精讲:16-熟悉Vite前端工具链
前端
瑞瑞小同学5 小时前
处理echarts x轴内容过多,重叠问题
前端·javascript·echarts
HexCIer5 小时前
面向未来的原子化 CSS:UnoCSS 核心架构分析与 Tailwind CSS 现状
前端·css·vite
程序员黑豆5 小时前
鸿蒙应用开发中的单位详解:px、vp、fp、lpx
前端·harmonyos
像我这样帅的人丶你还6 小时前
MCP + npm:给五年前的老系统接上AI
前端·javascript·agent