UNI-APP安卓本地打包详细教程(保姆级)

这篇具有很好参考价值的文章主要介绍了UNI-APP安卓本地打包详细教程(保姆级)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

一、开发环境

uni-app 官方文档地址  原生开发者支持

1、Android Studio 下载地址:Android Studio官网 OR Android Studio中文社区

2、最新版的HBuilderX

3、App离线SDK下载:最新android平台SDK下载

4、3.1.10版本起需要申请Appkey,申请请参考

二、准备环境

1)Android Studio下载

点击进入 Android Studio官网 或者 Android Studio中文社区

点击Download Android Studio,然后下滑弹窗勾选同意协议,并点击下载Android Studio

uniapp 安卓本地打包,前端,android,android studio,前端,vue.js

uniapp 安卓本地打包,前端,android,android studio,前端,vue.js

 下载成功后安装即可。

2)最新版HBuilderX下载

HBuilderX:官方IDE下载地址

HBuilderX 3.4.6版本起,取消单独的App开发版安装包,统一为一个标准安装包。标准版也可以安装app相关插件。

这里直接下载最新的正式版。

uniapp 安卓本地打包,前端,android,android studio,前端,vue.js

 如果是已有老版的HBuilderX,可打开编辑器后,通过点击帮助,点击检查更新后,直接点击立即更新,然后等待自动更新后重启HBuilderX即可

uniapp 安卓本地打包,前端,android,android studio,前端,vue.js

 3)App离线SDK下载

 点击进入:最新android平台SDK下载

 复制提取码后进入百度云直接下载最新版压缩包

uniapp 安卓本地打包,前端,android,android studio,前端,vue.js

下载成功后解压压缩包后打开,可根据个人习性,将HBuilder-Integrate-AS文件夹拷贝至其他专门存放打包文件的文件夹内

uniapp 安卓本地打包,前端,android,android studio,前端,vue.js

 4)生成本地打包APP资源

打开最新版HBuilderX,点击界面上方的发行,点击原生App-本地打包,点击生成本地打包资源 

uniapp 安卓本地打包,前端,android,android studio,前端,vue.js

生成资源成功之后,点击生成链接进入存放目录,保存生成的文件

uniapp 安卓本地打包,前端,android,android studio,前端,vue.js

5)申请Appkey

首先登录开发者中心,没有账号的必须注册一个。

登录成功后点击想要离线打包的项目,进入到项目的详情页

uniapp 安卓本地打包,前端,android,android studio,前端,vue.js

 点击菜单栏的离线打包Key管理,勾选打包的平台,自定义Android包名,输入Android 证书签名SHA1,最后点击保存即可生成AppKey。

可通过在生成的Android 证书目录里面cmd命令行输入

keytool -list -v -keystore 证件名.keystore

回车后输入证书文件密码,来查看证书信息(SHA1,SHA256证书指纹

uniapp 安卓本地打包,前端,android,android studio,前端,vue.js

 三、开始离线打包

上述准备工作全部完成后,首先打开Android Studio编辑器导入之前准备工作里步骤三生成的离线SDK资源里的 HBuilder-Integrate-AS 文件夹

uniapp 安卓本地打包,前端,android,android studio,前端,vue.js

uniapp 安卓本地打包,前端,android,android studio,前端,vue.js

导入成功后,首先替换掉simpleDemo\src\main\assets\apps目录下的原有资源,更换为之前准备工作里步骤四HbuiderX 生成的本地打包APP资源

uniapp 安卓本地打包,前端,android,android studio,前端,vue.js

然后将data目录下的dcloud_control.xml文件内的appid清空,更换成自己uni-app的应用标识AppID,也就是准备工作里步骤四HbuiderX 生成的本地打包APP资源的名称

uniapp 安卓本地打包,前端,android,android studio,前端,vue.js

 打开Androidmanifest.xml文件,将android:value替换为之前准备工作步骤五里申请的Appkey,将package更换为Android包名

uniapp 安卓本地打包,前端,android,android studio,前端,vue.js

uniapp 安卓本地打包,前端,android,android studio,前端,vue.js

 打开values目录下的strings.xml文件,输入自己应用想要的应用名称(类似QQ、微信这些应用名称)

uniapp 安卓本地打包,前端,android,android studio,前端,vue.js

 打开drawable目录,该目录主要存放

icon.png : logo图片

push.png : 消息推送logo

splash.png : 启动页

选中任意图片右键,可点击Create 9-Patch file 将图片更换为.9.png类型,防止不同型号手机导致图片变形

uniapp 安卓本地打包,前端,android,android studio,前端,vue.js

 打开build.gradle文件,填入Android包名和大版本号和小版本号

可通过在simpleDemo\src\main\assets\apps\__UNI__B0DA83E\www目录下的manifest.json文件查看版本号信息

uniapp 安卓本地打包,前端,android,android studio,前端,vue.js

 最后就可以点击Android Studio编辑器上方的build,点击Generate  Signed Bundle / APK进行打包

uniapp 安卓本地打包,前端,android,android studio,前端,vue.js

 uniapp 安卓本地打包,前端,android,android studio,前端,vue.js

依次输入Android平台签名证书(.keystore)的证书路径、证书秘钥、证书别名和打包密码

 uniapp 安卓本地打包,前端,android,android studio,前端,vue.js

选择正式包,最后点击Finish,等待打包完成即可

 uniapp 安卓本地打包,前端,android,android studio,前端,vue.js

最后这就是打包完成后的文件,整个离线打包也就结束了,可以直接在手机上进行安装了

 uniapp 安卓本地打包,前端,android,android studio,前端,vue.js

最后,如果这篇文章对大家有所帮助的话,希望大家一键三连红豆泥阿里嘎多文章来源地址https://www.toymoban.com/news/detail-856028.html

到了这里,关于UNI-APP安卓本地打包详细教程(保姆级)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • uni-app云打包与本地打包

    uni-app打包方式目前有两种,云打包和本地打包,主要介绍本地打包, 开始使用打包之前,我们先看一下【 发行 】的工具栏,我们来简单介绍一下云打包与本地打包的区别: 原生APP-云打包: 原生APP-本地打包: 用HBuilderX打开要打包的项目 选中项目列表中的项目右击选择发行

    2023年04月10日
    浏览(94)
  • uni-app打包之云打包与本地打包

    背景 由于早之前发的文章关于app的大杂烩文章太杂了, 所以打算给拆一拆,这篇是uni-app打包篇 uni-app打包方式目前有两种,云打包和本地打包,主要介绍本地打包,云打包比较简单,只进行简单的介绍 云打包 用HBuilderX打开要打包的项目 选中项目列表中的项目右击选择发行

    2024年02月02日
    浏览(59)
  • uni-app项目打包成apk(本地打包篇)

            最近可能要接一个uni-app的项目,之前没有接触过,因此学习了一下,好在uni-app基本算是vue和微信小程序的结合体,所以写代码方面问题不是太多,不懂的百度一下基本都能处理。写完demo之后,demo的内容应该能告诉客户我可以做,但我一开始是先用手机录制视频

    2024年02月03日
    浏览(52)
  • uni-app打包后安卓不显示地图及相关操作详解

    新公司最近用uni-app写app,之前的代码有很多问题,正好趁着改bug的时间学习下uni-app。 使用uni-app在浏览器调试的时候,地图是展示的,但是打包完成后,在app端是空白的。咱第一次写app,啥也不懂啊不是。 附上一张浏览器调试的截图: 安卓app上是空白页,就不附图了。 因为

    2024年02月11日
    浏览(70)
  • uni-app Android studio 本地打包 【图文讲解】

    需要修改文件列表 appsrcmainresvaluesstrings.xml 修改app名称 appsrcmainresvaluesAndroidManifest.xml 修改 包名 以及 uni-app 开发者后台生成的 离线打包可key simpleDemo 目录下的 准备安卓开发环境 (这里忽略,之前有文章讲解) 安卓开发环境 https://nativesupport.dcloud.net.cn/AppDocs/download/an

    2024年02月03日
    浏览(74)
  • uni-app使用HBuilder X编辑器本地打包apk步骤说明

    下载地址官方地址:Android Studio 下载文件归档  |  Android 开发者  |  Android Developers 安装Android SDK和Google USB Driver即可,后者主要是为了后期使用USB设置的,如果不需要可以不点。 下载地址:Android 离线SDK - 正式版 | uni小程序SDK 注意:Android离线SDK的版本一定注意和HBuilder X的版

    2024年02月04日
    浏览(68)
  • uni-app 使用安卓模拟器 mumu教程

    去官网下载 这个直接下载就行 去uni-app 里面配置 在这里设置adb路径和模拟器端口 进去安装目录找到adb.exe 相关的就行我的是 D:/moniqi/MuMuPlayer-12.0/shell/adb.exe 端口设置的是 16385 但是不起作用 找了半天 终于发现需要自己链接 adb 然后打开adb所在的目录 使用powerShell 打开后输入这

    2024年02月16日
    浏览(51)
  • uni-app之Cover-View组件详细使用教程

    在 UniApp 中,Cover-View 组件是一种用于展示覆盖在页面上方的视图元素的组件。它可以用于创建各种遮罩、弹出层、悬浮按钮等效果,提供了更多自定义样式和交互的可能性。本教程将详细介绍 Cover-View 组件的用法和示例代码。 步骤1:创建一个 UniApp 项目 首先,确保已经安装

    2024年02月07日
    浏览(188)
  • 【uni-app系列】uni-app之App打包

    选择菜单项 “发行” - “原生App-云打包”: 输入相关信息: 第一次安装时会提示安装依赖: 提示打包校验信息,点击【继续打包】: 如果没有实名认证,提示如下信息: 可以通过修改 manifest.json 取消通讯录权限或进行实名认证处理,本文通过实名认证处理。 登录 DCloud

    2024年02月08日
    浏览(76)
  • 这可能是最好、最详细的VSCode开发uni-app教程吧

    我们将使用VSCode写 uni-app ,不同于 Hbuilder X ,用VSCode是通过脚手架来创建项目,为什么我要用VSCode写呢?可能还是不太习惯 Hbuilder X 等等原因,还有就是不想换开发工具,觉得开发前端一个VSCode就够了,也不用去比较两者谁好谁坏,自己喜欢哪个用哪个,这里就不过多赘述了

    2024年02月02日
    浏览(112)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包