做一个专属自己的app

首先是如何打包:

​ 下载HBuilderx,下载好后创建5+app项目,然后npm run build 打包vue项目,生成dist文件,把dist文件的内容整个复制粘贴到新创的5+app项目中,有重复直接替换。

​ 替换完后安装安卓模拟器,我用的是 逍遥安卓模拟器 ,安装完后运行,HBuilderx应该可以自己识别到,点击运行

在这里插入图片描述

运行到模拟器中,如果没有检测到,重新打开HBuilderx,和安卓模拟器,如果还是不行就百度找找问题。

运行到模拟中后,你安装的模拟器就会自己下载一个app,就是你这个项目的app了。

这里我遇到一个问题,就是项目打包后项目显示空白问题:

在你之前的vue项目中创建vue.config.js文件,里面加入:

module.exports = {
  baseUrl:'./',//如果出错的话换成  publicPath:'./',(这个是因为vue版本问题)
  outputDir:'dist'
}

还是不行的话,更改一下router的路由模式,改为hash模式

最后重新npm run build 打包,生成dist文件,再重新进行上面的操作。

最后在真机上运行app:

​ 在HBuilderx中右键你的项目,点击发行原生app云打包,点击后会弹出打包选项框,起个android包名,使用公测证书,选择安心打包,其他默认就可以,之后会让你配置manifest.json,配置一下就行(百度),配置完后重新发行原生app云打包,会生成一个apk,把这个apk发到你手机上安装就可以了。(这里还有一个要注意的微信发送apk后会自动加一个xxx.apk.1的后缀,会不能安装,qq发apk就可以 。)

在这里插入图片描述

2021.10.30

Logo

前往低代码交流专区

更多推荐