wxa.js 如何使用 replace 插件实现版本号的方便更新

小程序在开发过程中,如果可以在应用的某个地方加入版本号的显示,可以在后续 debug 的过程中,快速的定位代码的版本。但在过去的开发过程中,我大多是手动修改版本号,这在实际的使用过程中,经常会出现忘记修改版本号,或者代码中的版本号和实际在 git 中记录的版本号不同,给自己在后续排除错误的时候增加困难。

不过,如果你在使用 wxa.js 的话,可以借助于 wxa.js 的 replace 插件来简化这个过程,降低工作量。

实现思路

npm 项目在其 package.json 中是有一个 version 字段的,我们可以借助 npm 自带的 version 功能,来实现版本的自增,并自动打上 git 的 tag,简化开发工作。

具体实现

想要实现自动管理控制,你需要在你的 wxa 项目中安装其 replace 插件

npm i -S @wxa/plugin-replace
Code language: CSS (css)

安装完成插件后,在wxa.config.js中引入 package.json,并添加一个replace 规则对象。

const ReplacePlugin = require('@wxa/plugin-replace');
const package = require("./package.json")
module.exports = {
    plugins: [
        // 一个规则对象,key 为目标字符串,value 为替换内容
        new ReplacePlugin({
          list: {
            'VERSION': package.version
          }
        })
    ]
}
Code language: JavaScript (javascript)

添加完成配置后,你就可以在你的小程序中的任何需要展示项目版本号的位置,新增一个 VERSION 字符串。后续在小程序开发过程中,这个版本号就会被替换为 package.json 中的版本号。

在后续开发时,当你完成了一个版本的开发时,就可以使用 npm version 命令来发布新的版本。

npm version 命令常用的版本变更命令包括:

  • npm version patch : 变更 patch 版本号,比如 1.0.0 变为 1.0.1
  • npm version minor : 变更 minor 版本号,比如 1.0.0 变为 1.1.0
  • npm version major : 变更 major 版本号,比如 1.0.0 变为 2.0.0
  • 更多的命令可以访问 https://docs.npmjs.com/cli/v6/commands/npm-version 查看

执行了版本变更命令后,npm 会自动更新 package.json 中的版本号相关字段,并自动执行 commit & 执行 git tag 命令。

如果你需要自定义 git message ,可以在执行命令时,加入 -m 参数,npm 会自动把版本号传递给 %s 字符串从而实现自定义的版本变更,比如 npm version patch -m "Upgrade to %s for reasons"

总结

wxa.js 提供的 replace 插件,可以帮助我们在开发过程中,通过简单的文本替换来实现一些简化工作流的功能, 如果你在使用 wxa.js 开发,不妨试试这个小技巧。

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注