小程序入门与实战教程:发布上线与更新版本

2020年6月27日13:47:07 发表评论 24 views

小程序的前端部分开发完成了,经过体验测试之后,我们需要发布上线了。

发布上线

一个小程序从开发完到上线一般要经过 预览 -> 上传代码 -> 提交审核 -> 发布等步骤。

打包代码

运行命令

npm run build

将 dist 下面的 src 放到微信开发者工具中打开。

预览

然后点击菜单栏的预览,使用手机扫描下面的二维码。帮助我们检查小程序在移动端上的真实表现。

小程序入门与实战教程:发布上线与更新版本
image
上传代码

同预览不同,上传代码适用于提交体验或者审核使用的。

小程序入门与实战教程:发布上线与更新版本
image

点击上传按钮,填写版本号以及项目备注,这里的版本号以及项目备注是为了方便管理员检查版本使用的,我们可以根据实际需求来填写这两个字段。

提交审核

为了保证小程序的质量,以及符合相关的规范,小程序的发布是需要审核的。

登录小程序后台 - 管理 -  版本管理 - 开发版本

小程序入门与实战教程:发布上线与更新版本
image

找到版本然后点击提交审核按钮。

发布

审核通过之后,管理员的微信中会收到小程序审核的通知。

登录小程序后台 - 管理 -  版本管理 - 审核版本 点击发布就可以了。一般是全量发布。

版本更新

里面的 onShow() 方法里面

 let updateManager = ();

        (res => {
            if () {
                ({
                    title: '正在更新,请稍后',
                    mask: true
                })
            }
        })
        (function () {
            ();
            ({
                title: '更新提示',
                content: '新版本已经准备好,是否重启应用?',
                success(res) {
                    if () {
                        // 新的版本已经下载好,调用 applyUpdate 应用新版本并重启
                        ()
                    }
                }
            })
        })

        (err => {
            ({
                title: '更新提示',
                content: '更新失败',
            })
        })
()

获取全局唯一的版本更新管理器,用于管理小程序更新。

返回值:UpdateManager

UpdateManager 对象

UpdateManager 对象,用来管理更新,可通过 接口获取实例。

方法:

()

强制小程序重启并使用新版本。在小程序新版本下载完成后(即收到 onUpdateReady 回调)调用.

(function callback)

监听向微信后台请求检查更新结果事件。微信在小程序冷启动时自动检查更新,不需由开发者主动触发。

(function callback)

监听小程序有版本更新事件。客户端主动触发下载(无需开发者触发),下载成功后回调。

(function callback)

监听小程序更新失败事件。小程序有新版本,客户端主动触发下载(无需开发者触发),下载失败(可能是网络原因等)后回调

「示例代码」

const updateManager = ()

(function (res) {
  // 请求完新版本信息的回调
  ()
})

(function () {
  ({
    title: '更新提示',
    content: '新版本已经准备好,是否重启应用?',
    success: function (res) {
      if () {
        // 新的版本已经下载好,调用 applyUpdate 应用新版本并重启
        ()
      }
    }
  })
})

(function () {
  // 新版本下载失败
})
Tips

总结

  • 小程序如何上线发布版本
  • 小程序上线之后如何更新版本

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: