新手教程-使用 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 设备上运行
相关推荐
合作小小程序员小小店1 小时前
web开发,在线%超市销售%管理系统,基于idea,html,jsp,java,ssh,sql server数据库。
java·前端·sqlserver·ssh·intellij-idea
不爱学英文的码字机器2 小时前
重塑 Web 性能:用 Rust 与 WASM 构建“零开销”图像处理器
前端·rust·wasm
浩星2 小时前
react的框架UmiJs(五米)
前端·javascript·react.js
子醉5 小时前
推荐一种适合前端开发使用的解决本地跨域问题的办法
前端
Niyy_5 小时前
前端一个工程构建多个项目,记录一次工程搭建
前端·javascript
xiangxiongfly9155 小时前
CSS link标签
前端·css
岁月宁静6 小时前
AI 多模态全栈应用项目描述
前端·vue.js·node.js
nn_(nana)7 小时前
修改文件权限--- chmod ,vi/vim,查看文件内容,yum-软件包管理器,systemctl管理系统服务
前端
烛阴8 小时前
从零开始掌握C#核心:变量与数据类型
前端·c#