uniapp 微信小程序自动更新版本号

在使用uniapp开发小程序时，突然想做一个版本号的展示功能，如图：

但是版本号需要一直更新，由于本人比较懒，并且怕每次打包发布时候忘记手动去更新它，就想写个程序可以在打线上包的时候可以自动去更新这个版本号，于是就开始准备

首先在src目录下准备一个文件夹，名叫 config，在config文件夹下再创建一个名为 version.js
的文件，将初始版本号写在这个文件下，就可以直接再页面中去引用这个版本号。

version.js

const version = '1.0.1'

module.exports = version

在页面中进行引用：

<div class="version">v{{ version }}</div>

......

import version from '@/config/version'
data() {
   return {
     version: version
   }
},

之后就只需要在每次打包时候去自动更新这个版本号即可

在src目录下继续创建一个 updateVersion.js 的文件，使用 node.js 的 fs 模块我们可以让这个版本号自动去更新：

const fs = require('fs')	// 导入fs模块

var version = require('./config/version.js')	// 获取当前版本号

let currentVersion


let versionNum = Number(version.split('.').join(''))	// 去除版本号中间的 “.”，并转为数字类型
versionNum++	// 累加版本号
currentVersion = versionNum.toString().split('').join('.')	// 将 “.” 再次加上

console.log(`当前版本号：${currentVersion}`)

// 将最新的版本号拼接到 version.js 的内容中
const versionFile = `const version = '${currentVersion}'

module.exports = version
`
// 重新写入最新的版本号代码
fs.writeFile('src/config/version.js', versionFile, 'utf-8', function(err) {
  if (err) {
    return console.log('写入文件失败', err.message)
  } else {
    console.log('写入成功')
  }
})

这个时候只需要在小程序的打包时先去执行 version.js 这个文件就可以自动更改版本号，并在页面中显示最新的版本号。

// 在 package.json 文件的 scripts 下，加上一行执行代码：
"updateVersion": "node src/updateVersion.js"

// 在原本的小程序打包执行命令前方拼接 npm run updateVersion 就可以先去执行更新版本号。
// 更改前
"build:mp-weixin": "cross-env NODE_ENV=production UNI_PLATFORM=mp-weixin vue-cli-service uni-build",
// 更改后
"build:mp-weixin": "npm run updateVersion && cross-env NODE_ENV=production UNI_PLATFORM=mp-weixin vue-cli-service uni-build",

最终效果就是执行打包指令后，文件和页面的版本号都自动进行更新