HBuilder制作移动APP资源升级包的教程。

该教程主要是，用于Vue项目采用HBuilder进行app打包和设置升级包。

该Vue项目是采用Vue+Vue手脚架+webpack构建的
首先可以选择发行->制作移动app资源升级包，点击以后

可以去官网看下教程。

接下来在你的Vue代码里添加以下代码。
我在login.vue文件下写了一个在线更新为他绑定了一个更新事件

接下来就为UPpackage函数添加代码了。

UPpackage () {
        // 获取当前应用的版本号
        var wgtVer = null;
        function plusReady () {
          // ......
          // 获取本地应用资源版本号
          plus.runtime.getProperty(plus.runtime.appid, function (inf) {
            wgtVer = inf.version;
            alert('当前应用版本：' + wgtVer);
          });
        }
        if (window.plus) {
          plusReady();
        } else {
          document.addEventListener('plusready', plusReady, false);
        };
        // 发起ajax检测是否有新版本
        var checkUrl = 'http://服务器域名/文件夹/mananger_tool/update/update.php';
        function checkUpdate () {
          alert('检测更新');
          plus.nativeUI.showWaiting('检测更新...');
          var xhr = new XMLHttpRequest();
          xhr.onreadystatechange = function () {
            switch (xhr.readyState) {
              case 4:
                plus.nativeUI.closeWaiting();
                if (xhr.status === 200) {
                  alert('检测更新成功：'+ xhr.responseText);
                  var newVer = xhr.responseText;
                  if (wgtVer && newVer && (wgtVer !== newVer)) {
                    downWgt();  // 下载升级包
                  } else {
                    plus.nativeUI.alert('无新版本可更新！');
                  }
                } else {
                  alert('检测更新失败！');
                  plus.nativeUI.alert('检测更新失败！');
                }
                break;
              default:
                break;
            }
          };
          xhr.open('GET', checkUrl);
          xhr.send();
        }
        checkUpdate();
        // 下载wgt文件
        var wgtUrl = 'http://服务器域名/文件夹/mananger_tool/update/update.wgt';
        function downWgt () {
          plus.nativeUI.showWaiting('下载wgt文件...');
          plus.downloader.createDownload(wgtUrl, {filename: '_doc/update/'}, function (d, status) {
            if (status === 200) {
              alert('下载wgt成功：' + d.filename);
              installWgt(d.filename); // 安装wgt包
            } else {
              alert('下载wgt失败！');
              plus.nativeUI.alert('下载wgt失败！');
            }
            plus.nativeUI.closeWaiting();
          }).start();
        };
        // 更新应用资源
        function installWgt (path) {
          plus.nativeUI.showWaiting('安装wgt文件...');
          plus.runtime.install(path, {}, function () {
            plus.nativeUI.closeWaiting();
            alert('安装wgt文件成功！');
            plus.nativeUI.alert('应用资源更新完成！', function () {
              plus.runtime.restart();
            });
          }, function (e) {
            plus.nativeUI.closeWaiting();
            console.log("安装wgt文件失败["+e.code+"]："+e.message);
            plus.nativeUI.alert("安装wgt文件失败["+e.code+"]："+e.message);
          });
        }
      }

你们可以直接复制过去用，不过需要进行适量的修改。PS：这段代码就是官网教程的代码，不过需要自己调用他的函数

update.php主要就是返回最新的版本号，我返回的是一个字符串，2.0.你们可以根据自己的需求进行修改，注意修改url,

update.wgt这个就是升级包，这两个文件我都是部署的服务器上，你们可以根据自己的需求进行修改。接下来就是讲如何制作安装包。
首先，需要把你的Vue项目通过npm run build 命令打包dist文件，具体教程可以百度

打包之后会在你的目录下出现一个dist文件夹。

然后打开dist文件夹下的index就是你的项目（新手打包出来的index页面可能会出现空白，这个问题很好解决只需要把index内部的链接修改一下,主要是因为打包的过程中没有修改 打包的url造成的路径问题。具体教程百度很多）
加粗样式
第二步，打包好dist文件以后，打开index顺利出现你的项目或者是界面，那么就成功了，接下来需要把打包好的文件丢入HBuilder中，

右键点击dist转换成手机APP

项目下就会出现一个manifest.json文件，我们对其进行修改，因为这是第一版本所有修改他的版本号为1.0

右键点击dist文件夹，选择发行->app云端打包

点击打包，等打包好了把东西APK下载下来安装到手机就ok了。
接下来就是制作更新包了！！！！ 就是上面所讲的update.wgt文件
然后我修改了我的vue代码注销了跳转主页

第一步，还是进行npm run build 进行资源打包，打包出你的dist目录。

然后修改你的manifest.json文件，版本修改为2.0

接下来在hbuder中右键点击->发行->制作移动APP资源升级包。

直接点确定

把这个文件修改成刚才url请求的wgt文件的名字，我的是UPpackage.wgt.。
接下来就只需要把文件丢在服务器上，然后在手机端点击更新按钮，就可以自动在线更新了。如果没有反应很有可能是出现了跨域请求的问题，这个就交给你们的服务端人员去解决。