新建项目

网上的大多数资料都hbuild,现在官方版本是HbuildX。先新建一个H5+的项目
自己在vue中打包成apk的时候遇到的坑。 - 图1

生成后的目录结构

  1. unpackage是用来放图片的
  2. inex 是vue的页面
  3. mainfest.json是关于打包的一些配置

自己在vue中打包成apk的时候遇到的坑。 - 图2

关于mainfest.json的配置

可以看这个博主写的 很详情： https://www.cnblogs.com/taohuaya/p/10263519.html

点击按钮自动更新软件

  1. // 将这行代码放到index.html中，放在vue的mouted和created中会报错。有大神弄好可以告诉下
  2. ## inde.html
  3. <script>
  4.     // 用来做安卓版本更新
  5.     document.addEventListener(
  6.       "plusready",
  7.       function() {
  8.         console.log(JSON.stringify("121212"));
  9.       },
  10.       false
  11.     );
  12.   </script>
  13. // 点击升级按钮
  1. // 运行的时候plus 一定要ready不然会报错
  2. ## home.vue
  3.  versionUP() {
  4.       let  ver ='1.0.1';
  5.       plus.runtime.getProperty(plus.runtime.appid, function(inf) {
  6.         // hbuild自带的全局弹窗方法
  7.         plus.nativeUI.showWaiting("下载中...");
  8.         if (
  9.           +inf.version.slice(".").replace(/\./g, "") < +ver.replace(/\./g, "")
  10.         ) {
  11.           // plus.nativeUI.toast("正在准备环境，请稍后！");
  12.           var dtask = plus.downloader.createDownload(
  13.             "https://files.sumi.io/grid-diary-china-latest.apk",
  14.             {},
  15.             function(d, status) {
  16.               plus.nativeUI.closeWaiting();
  17.               if (status == 200) {
  18.                 var path = d.filename; //下载apk
  19.                 plus.runtime.install(path); // 自动安装apk文件
  20.               } else {
  21.                 plus.nativeUI.alert("版本更新失败:" + status);
  22.               }
  23.             }
  24.           );
  25.           dtask.start();
  26.         }
  27.       });
  28.     },

H5+：的文档 https://www.dcloud.io/docs/api/

遇到的坑

  1. console.log(JSON.stringify("121212"));打印的时候一定要这样，不要问我怎么知道的都是坑
  2. 遇到打包后白屏：
    • 需要将配置文件中 / 改为 ./image.png
    1. 将模式router模式改为hash

      调试

      image.png