React Native 0.74 Android 环境搭建指南
发布网友
发布时间:2024-09-29 09:20
我来回答
共1个回答
热心网友
时间:2024-10-11 05:00
在移动应用开发领域,我们拥有多种选择,包括原生开发、混合开发和H5开发。其中,混合开发领域中,我们能够利用React Native与Android或iOS结合,创造出可在不同平台运行的移动应用。
本文将基于React Native 0.74版本的官方文档,分步骤指导大家搭建React Native 0.74的Android环境,并分享可能遇到的常见问题及解决方案。最终目标是构建出一个功能齐全的React Native Android应用。
我们使用的是以下环境:mac m1、java17、react native 0.74、android sdk 34、ndk 26、Android Studio Iguana | 2023.2.1 Patch 1。希望这篇文章能帮助大家在开发移动应用时少走弯路,更加得心应手。
搭建过程分为四个主要步骤:安装依赖、初始化项目、运行项目和打包发布。
第一步 安装依赖
遵循官方指南,我们选择安装macOS和Android原生构建教程所需的工具。
1.1 安装Node、Watchman
确保Node版本为18,推荐使用nvm(Node Version Manager)管理Node版本,以便切换至Node18。
1.2 安装JDK
如果电脑上已有JDK1.8版本,请确保替换为React Native 0.74所需的版本。通过运行命令查看所有安装的JDK版本,若不符合要求,需按照官方指南安装相应版本的JDK。推荐使用Zulu OpenJDK以提高性能和稳定性。
1.3 安装Android Studio
依据官方Android教程,安装Android编辑器、Android SDK和Android虚拟设备,为后续开发做好准备。
第二步 初始化项目
首先删除本地react-native,然后初始化项目。
初始化项目
项目结构如下:
完成根目录下的yarn i操作,下载所有npm依赖。
第三步 运行项目
执行命令启动React Native服务,安装Android相关依赖,结合Android源码和配置生成apk文件,并将其安装至模拟器中运行。
解决依赖安装问题
依赖需要设置为google地址和aliyun,避免网络问题影响依赖安装。若遇到ndk版本对应错误,需在Android编辑器中下载相应ndk版本。确保依赖版本与Android源码下的build.gradle文件声明一致。
第四步 打包发布版本
目标是生成apk和aab版本,其中aab用于发布到应用商店,而apk可以直接安装到Android设备。
应用签名
无论是向应用商店提交还是直接安装到手机,都需要对应用进行签名。在初始化项目时,应用采用debug.keystore进行签名,生成app-debug.apk。对于发布版本,需生成发布版本的证书文件。在macOS上,通过执行特定命令找到JDK目录,使用具有sudo权限的keytool命令生成证书文件,重命名后放置在安卓app目录下。解决在配置过程中遇到的提示问题,新建keystore.properties文件,重新编写构建配置,并修改signConfigs进行读取。注意debug和release使用同一签名以避免在调试和发布时包名不一致导致无法覆盖安装。
构建发布版本
使用命令生成release apk版本,使用另一命令生成aab版本,用于应用商店发布。最终,apk可直接安装到手机上,手机系统将进行证书检测和认证。
总结本文,我们通过依赖安装、项目初始化、项目运行和打包发布四个步骤详细阐述了React Native 0.74 Android环境的搭建过程。对于前端工程师而言,Android环境配置的难点在于其细节,但深入了解Android官网原理后,将对后续混合应用开发大有裨益。
React Native 0.74 Android 环境搭建指南
1.2 安装JDK如果电脑上已有JDK1.8版本,请确保替换为React Native 0.74所需的版本。通过运行命令查看所有安装的JDK版本,若不符合要求,需按照官方指南安装相应版本的JDK。推荐使用Zulu OpenJDK以提高性能和稳定性。1.3 安装Android Studio依据官方Android教程,安装Android编辑器、Android SDK和Android虚拟...
React Native搭建开发环境/link原生依赖问题
使用 React Native 命令行工具来创建一个名为"demo"的新项目:react-native init demo 创建指定RN版本项目:react-native init demo --verbose --version 0.44.0(版本号)四、编译并运行React Native应用 进入项目cd demo 运行项目react-native run-android link问题引入navigation相关配置文件注意链接原生...
如何在Android和iOS平台运行React Native应用
接下来我通过command+n新建一个终端,1首先先切换到项目路径,再在终端中输入react-native run-android命令
React Native从入门到APK安装
首先,确保安装最新版本的Node(12或更高)和Yarn,Yarn能加速模块下载。对于新手,推荐使用Expo CLI快速启动项目,它支持Web预览和真机模拟。对于有经验的开发者,可以选择React Native CLI进行更深入的配置。环境配置中,MacOS是最佳选择,Windows不支持iOS。需安装Homebrew和watchman,前者用于管理包,后者监...
reactnative环境搭建?
1、首先安装了nodejs4.1版本2、然后安装了npminstall-greact-native-cli模块3、安隐哪装androidsdk并且配置android环境变量4、安装gradle环境5、进入这个博清羡客里边有react-nativeforandroid项目,下载下来,然后执行灶正码npminst...ReactNative搭建环境及librarynotfoundfor-lstdc++.6.0.9问题解决方案 一.搭建RN环境:...
reactnative怎么安装
需要配置path,加入如:E:\Android\Python27;C:\Users\che\AppData\Roaming\npm;安装git git可先不安装,若后续步骤皆安装完毕后。执行react native指令抛错,可考虑是否是这个原因造成。我之前为了排错把这个装上了,结果是nodejs版本问题。所以git是否有影响暂不清楚。故此处标*,望大神日后补充。安装...
如何创建一个android的react-native组件
Step 1 - 新建react-native工程 ReactNativeToastAndroid react-native init ReactNativeToastAndroid1 Step 2 - 将新建的工程导入android studio然后新建空library(以react-native-toast-android为library的名称)之所以要新建一个library而不在ReactNativeToastAndroid工程中写呢,主要是为了方便上传到npm及...
如何使用React Native Android 实现本地组件的安装
npm install -g 中-g是globel的意思 require 寻找顺序是依次寻找上级目录 可以通过react-native android在当前目录下创建一个包括rn骨架的工程 默认引用index.android.js 直接自定义使用也是不行的 Command`run-myReactAndroid` unrecognized Usage:react-native ...
配置react native 环境需要哪些版本的sdk
1、首先安装了nodejs4.1版本2、然后安装了npminstall-greact-native-cli模块3、安装androidsdk并且配置android环境变量4、安装gradle环境5、进入这个博客里边有react-nativeforandroid项目,下载下来,然后执行npminstall先安装react依赖模块包6、打开两个命令窗口1.一个执行react-nativestart,另一个执行react-...
react native配置了android sdk 但是还是报错
1、首先安装了nodejs 4.1 版本2、然后 安装了 npm install -g react-native-cli 模块3、安装 android sdk 并且配置android 环境变量4、安装gradle 环境5、进入 这个博客 里边有 react-native for android 项目,下来,然后执行 npm install 先安装 react 依赖模块包6、打开两个 命令窗口 1. 一个 ...