vue项目利用Hbuilder打包成APP流程,以及遇到的坑

本文介绍使用HBuilder进行APP打包过程中遇到的问题及解决方案,包括白屏、页面跳转失败、物理按钮响应不当等问题,并提供了详细的步骤指导。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

目录

1.打包项目

1.1打包的app出现白屏。

 1.2点击页面跳转不了,报 Loading chunk 2 failed. 等错误。

1.3.点手机物理按钮,直接退出程序。

2.Hbuilder发布

 2.1创建项目5+App项目

2.2 替换文件

2.3利用云打包发布APP

1.打包项目

期间遇到的坑,提前说下,避免重复工作。

1.1打包的app出现白屏。

出现原因:路径不对,需要改config\index.js

解决办法:修改打包的路径。

 1.2点击页面跳转不了,报 Loading chunk 2 failed. 等错误。

出现原因:不能用history配置路由,要用hash

解决办法:修改路由mode属性为hash。

1.3.点手机物理按钮,直接退出程序。

出现原因:无理返回键直接用监听不到路由,会直接退出程序。

解决办法:可以引入mui,就能正常使用了。

1.在webpack.base.conf.js里面引入mui。(图一)

2.下载mui相关文件,在main.js里面引入。(若需要使用mui其他方法,请自行查阅资料)(图二)

3.这个时候,引入mui可能会报错,我们需要修改一些文件。(图三)

 

(图一)

(图二)

(图二) 

(图三)

 

2.Hbuilder发布

 2.1创建项目5+App项目

2.2 替换文件

先删除默认的css、img、js、index.html等无用默认文件。再将打包好的dist文件夹下的static和index.html文件,放至新建的项目下。

相关app的配置可自行在manifest.json中修改,这里不做详细说明。

2.3利用云打包发布APP

如有证书,就填写证书等信息,若没有可临时用Dcloud公用证书。

填完信息,点击打包即可,之后就等待打包生成app的下载链接,进行下载安装啦。

个人记录~ 

评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值