最近可能要接一个uni-app的项目,之前没有接触过,因此学习了一下,好在uni-app基本算是vue和微信小程序的结合体,所以写代码方面问题不是太多,不懂的百度一下基本都能处理。写完demo之后,demo的内容应该能告诉客户我可以做,但我一开始是先用手机录制视频,然后把录制的视频给客户看的。但这样不够好,因为不知道打包成apk后会遇到什么问题,因此还是自己摸索着去打包成可安装的apk,直接让客户试用。

下面的步骤,不要跳步,一步步看,肯定是可以成功的。

1. 本次用到的工具:

1. 代码开发工具:HBuilder X

2. apk打包工具:Android Studio

        3. apk打包SDK:Android离线SDK  (下载地址:Android离线SDK)

3. 生成签名证书的工具:jdk1.8(网上说只要装jre就行,但jdk里包含jre,所以直接装jdk吧,jdk装完要配置环境变量,jdk环境变量的配置可以看这个:jdk环境变量配置)

4. 生成appkey的网站:DCLOUD的开发者中心(网址:开发者中心)

2. 导出前的配置

在 HBuilder X 中打开uni-app项目中的 mainifest.json 文件,会弹出来一些可配置的内容,这次我们简单一点,只配置基础配置。其中 uni-app应用标识(AppID) 如果默认没有的话,点后面的 重新获取 即可,它会警告你,不过点了没事,且会为你生成一个AppID。然后就是选择开发使用的vue版本,按实际选择即可,其它的貌似可以随便填(如果只是做打包测试的话)。

3. 导出uni-app项目供打包使用

项目代码在自己手机上测试运行成功后,我们需要把uni-app的项目导出。点击 HBuilder X上方的 发行-->原生App-本地打包-->生成本地打包App资源 即可。如果是第一次点击,可能会提示你装什么东西,按提示的来,同意安装就可以了。

导出成功后,HBuilder X 下方的控制台会告诉你导出路径。至此,HBuilder X 的任务完成。

4. 下载Android离线SDK

Android离线SDK 下载地址:Android离线SDK

这个sdk可能不止用来打包apk,但目前我只是用来打包apk。

5. 将HBuilder X导出的文件夹移动到离线SDK中

将刚才 HBuilder X 导出的以AppID命名的文件夹(www文件夹的上一级)整个移动到离线SDK的 HBuilder-Integrate-AS\simpleDemo\src\main\assets\apps 路径下,该路径下默认会有一个叫 __UNI__A 的文件夹,这个直接删除,我们用不到。

6. Android Studio 导入SDK中的示例项目

如果第一次安装 Android Studio,安装过程中会提示你缺啥好像,记不太清了,直接cancel那个提示,然后跟着引导一步步安装就行了,安装结束后,好像也没什么问题。

接着导入离线SDK中的 HBuilder-Integrate-AS 文件夹到 Android Studio 中。注意:文件路径中不要出现中文!否则会报错!

7. 修改dcloud_control.xml 中的 appid

接下来,别纠结截图中我 Android Studio 的文件结构为什么你不一样,截图中有些文件夹或者路径好像被隐藏了,这不重要,我只是来打包的。

找到 assets/data 下的 dcloud_control.xml 文件,点开它,将文件中appid的值,改成 HBuilder X 中生成的appid。appid记不住没关系,还记得第5步中让你移动的那个文件夹吗,它的文件名就是appid

8. 生成Android证书签名

这一步我参考了别人的文章,所以不多讲了,按他的步骤做(jdk环境变量的配置虽然他文章里写了,小白最好还是看这个:jdk环境变量配置),记下生成证书的文件路径、证书的SHA1安全码、证书的alias(别名)以及设置的两个密码(怕忘记,两个密码设一样的),后续步骤会用得到。参考网址(生成Android证书签名)。

9. 生成appkey

前往 DCLOUD 的开发者中心(网址:开发者中心),如果按照我的步骤做,那在第2步 HBuilder X 中生成appid后,就能在开发者中心我的应用中看到这条应用,点击应用名称会跳转到该条应用的管理页面。

点击上方的 离线打包Key管理 按钮,进入生成appkey的菜单。我的这个菜单是已经生成appkey的,所以会和你第一次点进来有所不同,不用担心。

 选择平台:我们选择Android,因为我们这次是打包apk。

Android包名:包名不能随便写,否则安装apk打开后会报错!它的值在离线SDK的 \HBuilder-Integrate-AS\simpleDemo\src\main\AndroidManifest.xml 中,没改过的话应该跟我一样,是 com.android.simple

Android证书签名SHA1:第8步中让你记下的SHA1安全码。

这些填完后,点确认还是啥的,应该就可以生成appkey了。

10. 在 AndroidManifest.xml 中配置appKey

        回到 Android Studio ,在 AndroidManifest.xml 中配置appKey

11. 打包apk

现在万事俱备,只剩打包了,点击 Android Studio 上方的 Build-->Generate Signed Bundle / APK...

弹出打包窗口,选择 APK,然后点击 Next

点击 Choose existing...,选择第8步让你记下的证书存放路径,Key store path 就会自动填充,Key store password、Key alias、key password,这三项也在第8步中设置。如果两个password记不住了,那就按第8步的教程重新生成一个证书吧。Remember passwords 根据自己需要吧(小白还是勾吧,记住密码)。全部填完后点击下方 Next

最后就是选择导出路径,然后选择 release,然后点击下方 Finish

导出成功后,Android Studio 下方的 Build 控制台会提示 BUILD SUCCESSFUL 。

然后就可以在导出路劲的release文件夹里找到打包好的apk文件了,截图里的是默认导出路径,你可以在release的时候选择你的导出路径。

然后在手机上安装刚才的apk并打开,如果正常打开,那基本就成功了。

我在摸索的时候,打包成功后,安装到手机,打开app的时候提示appkey不存在或配置错误,后来发现是第9步生成appkey的时候,包名写错了,一定要和 AndroidManifest.xml 文件中的包名一样。

更多进阶的内容,等我摸索完再发文章,多多点赞,感谢支持!

uni-app项目打包成apk(本地打包篇)相关推荐

  1. APP代码打包成apk文件

    序言 该篇文章对于APP云打包功能进行讲解,欢迎大家指出问题和发表建议! 生成证书文件 APP开发完成之后,需要打包成apk文件安装到手机上. 生成证书文件之前需要 Android Studio文件( ...

  2. 使用cordova把h5应用打包成apk

    由于h5应用开发不是本例重点,因此直接提供一个最简单的h5应用代码,此应用使用vue-cli框架开发 此h5应用叫vue1,用webstrom打开vue1,进行npm install安装引用 vue1 ...

  3. 转:教大家如何用HBuilder将web项目打包成apk

    链接:https://www.jianshu.com/p/d86bf569295d 将我们的web项目打包成一个apk文件并不难,首先准备好软件HBuilder还有你的项目,注意这里只献给那些不是真正 ...

  4. 教你如何3分钟把VUE项目打包成apk,真的只要3分钟

    前提准备 使用vue-cli3搭建的项目 工具 HBuilder X,他的图标长这个样子,点击下载 做前端的大多数小伙伴们都应该知道,使用起来轻巧.急速,但是他主要是针对于VUE生态打造的,相对于 v ...

  5. Cordova将vue项目打包成apk(全使用命令行)

    场景 假设vue项目已经搭建好,要将其打包成apk. 实现 编译vue项目 在vue项目目录下打开cmd,输入: npm run build 新建cordova项目 来到要新建cordova项目的目录 ...

  6. 将Eclipse Android项目打包成APK文件

    将Eclipse Android项目打包成APK文件是本文要介绍的内容,主要是来了解并学习Eclipse Android打包的内容,具体关于Eclipse Android内容的详解来看本文  . Ec ...

  7. android程序导入虚拟机,android项目打包成apk应用程序后部署到虚拟机上测试

    一:打包成apk包 这个比较简单,如下 右键点击项目--> export -->  android Project -->  选择密钥等信息  --> 填写密钥信息  --&g ...

  8. java eclipse生成apk,将Eclipse Android项目打包成APK文件

    将Eclipse Android项目打包成APK文件是本文要介绍的内容,主要是来了解并学习Eclipse Android打包的内容,具体关于Eclipse Android内容的详解来看本文. Ecli ...

  9. c语言 打包成app,uni-app初体验及打包成apk

    首先用HBuilderX新建建一个uni-app项目 新建一个目录ucenter,该目录下新建两个vue文件ucenter.vue和setting.vue ucenter.vue {{ name }} ...

  10. vue 使用window的对象_如何3分钟把VUE项目打包成apk

    必要条件 使用vue-cli3搭建的项目 工具 HBuilder X,他的图标长这个样子,下载地址:https://www.dcloud.io/hbuilderx.html 做前端的大多数小伙伴们都应 ...

最新文章

  1. 图解深度强化学习(简单的)
  2. 路径搜索算法 python实现_A*算法在栅格地图上的路径搜索(python实现)
  3. python格式规范的要求_python模块规定的格式,按照这样写,最规范
  4. 信息系统项目管理师-组织级项目管理与大型项目管理知识点
  5. 反思深度思考:预热[准备] 高密度[压力专注] 辨真伪[冷静分析] 反推[灵活] 结构化[全局]
  6. python制作远程桌面控制_Python 远程桌面协议RDPY简介
  7. 深入Java中文问题及最优解决方法-下(转)
  8. Redis夺命连环11问
  9. fiddler设置中文版本_Python3.x+Fiddler 抓取 APP 数据
  10. java中的List排序[转]
  11. Reader entry: ���� 乱码
  12. Html5 学习系列(二)HTML5新增结构标签
  13. win10、win7安装SQLServer2000最详细教程
  14. STC89C52引脚图
  15. 移动魔百和M302A-ZN-S905L2_蓝牙语音正常_线刷免费固件包
  16. 微信小程序初级——快递查询(利用聚合数据接口开发)
  17. 网络电视服务器账号密码,中兴网络电视机顶盒密码是多少
  18. 【编程题】【Scratch二级】2021.12 绘制多边形
  19. 正面杠腾讯音乐与网易云音乐,抖音与快手谁能“弯道超车“?
  20. sq-接口项目-外卖系统

热门文章

  1. QDUOJ 93 - 分辣条(01背包)
  2. 制作辣条视频教程+配方
  3. 精密划片机的三种切割方式
  4. 一文入手 JUC(20+单元)
  5. html学习 - 检测浏览器是否支持Canvas
  6. MySQL菜鸟学习日志——0001
  7. C#(0x8007000B)
  8. Android 的窗口管理系统 (View, Canvas, WindowManager)
  9. numpy_10 思维导图
  10. phpword 模板替换文字和图片