在客户端访问界面时 控制台打印版本信息
1686736852(1).png
在vue.config.js添加
// 获取当前git分支信息
function getBranchVersionInfo() {
let vName = execSync('git name-rev --name-only HEAD').toString().trim();
return vName
}
module.exports = {
chainWebpack: config => {
config.resolve.alias.set('@', path.resolve(__dirname, 'src'));
config.resolve.alias.set('@types', path.resolve(__dirname, 'src/@types'));
// 主要是下面这一段
// 使用webpack.DefinePlugin
config.plugin('define').tap(args => {
args[0]['process.env'].WEB_VERSION = (function () {
const now = new Date()
function format (num) {
return num < 10 ? '0' + num : '' + num
}
const v = now.getFullYear() + format(now.getMonth() + 1) + format(now.getDate()) +'-'+ format(now.getHours()) + format(now.getMinutes())
console.log('process.env.WEB_VERSION', v)
return JSON.stringify(v)
})()
args[0]['process.env'].nowBranch = (function () {
console.log('process.env.nowBranch', getBranchVersionInfo())
return JSON.stringify(getBranchVersionInfo())
})()
return args
})
// end
},
}
最后在main.js或者入口文件app.vue可以打印
const t = "color:#ccc;font-size:12px;background:#333;padding:2px 4px;border-radius:4px 0 0 4px;"
const e = "color:#fff;background:green;padding:2px 4px;border-radius:0 4px 4px 0;"
const i = "color: green;font-size: 18px;font-weight:bold;";
console.log("%c" + "=".repeat(18) + "版本信息" + "=".repeat(18), i),
console.log(`%c打包时间：%c${process.env.WEB_VERSION}`, t, e),
console.log(`%cbranch：%c${process.env.nowBranch}`, t, e),
console.log("%c" + "=".repeat(18) + "版本信息" + "=".repeat(18), i)
