react-native 搭建环境及运行项目

本文指导读者如何在Node.js版本18及以上且JDK为17的情况下,通过AndroidStudio搭建Android开发环境,包括设置环境变量、全局安装reactNative以及连接手机进行项目运行。过程中强调了AndroidStudio的下载、配置步骤和注意事项。
摘要由CSDN通过智能技术生成
目前创建的是0.73版本的,Node 的版本应大于等于 18,需要 Java Development Kit [JDK] 17版本的(必须是17版本)。安装完后你可以在命令行中输入 javac -version(请注意是 javac,不是 java)来查看你当前安装的 JDK 版本搭建Android 开发环境

首先搭建Android 开发环境,搭建过程是有一点坑的。
1、下载 Android Studio
国内用户可能无法打开官方链接,那就需要先连接VPN,再进入官方链接下载。没有VPN就自行使用搜索引擎搜索可用的下载链接。
点击进入 Android Studio

 

2、 安装 Android Studio

一直Next就完事了

3、配置Android Studio
(1)选择方式 默认选择第二个选项就好 

(2)进入到初始配置页面,点击 Next,如下:

(3)选择自定义安装,如下:一路next即可

(4)同意协议分别点击左边的三个项目,勾选右边的 Accept 表示同意协议,然后点击 Finish:

安装完成后

然后去配置环境变量

react Native 需要通过环境变量来了解你的 Android SDK 装在什么路径,从而正常进行编译。

新建一个名为ANDROID_HOME的环境变量(系统或用户变量均可),指向 Android SDK所在的目录(具体的路径可能和下图不一致,请自行确认):

 添加环境变量 Path

选择Path变量,然后点击编辑,点击新建把这些工具目录路径添加进去:platform-tools、emulator、tools、tools/bin

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

全局安装react native 

npm i -g create-react-native-app


// 创建项目
npx react-native init  '项目名字'

 我连的手机直接在命令行运行(说实话我也没太搞懂)

我第一次先执行的 

yarn  android  (这里要下载很多东西,建议连外网)
然后就是运行项目

npx react-native start
运行前可以先执行   adb devices 命令 去查看是否连接了设备

总的来说很坑,rn现在也没有正式版,网上一堆方法照着做也会出错,只能自己去慢慢摸索

  • 22
    点赞
  • 22
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
搭建 React Native 环境需要以下步骤: 1. 安装 Node.js React Native 依赖 Node.js 运行环境,因此需要先安装 Node.js。你可以在官网上下载适合你操作系统的版本并安装。 2. 安装 React Native 命令行工具 在终端中运行以下命令安装 React Native 命令行工具: ``` npm install -g react-native-cli ``` 3. 安装 Java SE Development Kit 安装 Java SE Development Kit (JDK) 是因为 React Native 的一些依赖需要 Java。你可以在官网上下载适合你的操作系统的版本并安装。 4. 安装 Android Studio 安装 Android Studio 是因为 React Native 开发需要 Android 环境,Android Studio 提供了 Android 的开发工具和模拟器。你可以在官网上下载适合你操作系统的版本并安装。 5. 配置 Android SDK 在 Android Studio 中配置 Android SDK。打开 Android Studio,选择 "Configure" -> "SDK Manager",在 "SDK Platforms" 标签页中选择相应的 Android 版本并安装,然后在 "SDK Tools" 标签页中安装 "Android SDK Build-Tools" 和 "Android SDK Platform-Tools"。 6. 配置环境变量 将以下路径添加到环境变量中: ``` ANDROID_HOME=<path to Android SDK> ``` 将 `<path to Android SDK>` 替换成你的 Android SDK 的路径。在 macOS 或 Linux 中,可以将以上命令添加到 `~/.bash_profile` 文件中。 7. 创建 React Native 项目 在终端中运行以下命令创建一个新的 React Native 项目: ``` react-native init <project name> ``` 将 `<project name>` 替换成你的项目名称。等待一段时间,直到项目创建完成。 8. 运行 React Native 项目 进入项目目录,运行以下命令启动项目: ``` cd <project name> react-native run-android ``` React Native 将会自动编译和安装应用程序到模拟器或连接的设备中。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值