背景
因為公司產(chǎn)品屬于B端的產(chǎn)品，客戶有定制產(chǎn)品升級也不一致，而且客戶比較強硬，必須在客戶版本上解決問題，所以只能根據(jù)客戶反正解決，導(dǎo)致版本信息比較亂，所以開發(fā)本插件 注入插件后，配置一下在瀏覽器的console里面顯示
作用和效果
-
全部提交后的效果
image.png
-
漏提交后的效果
image.png
- 無git信息時
image.png
安裝
npm i build-version-plugin -D
VueCli3配置
修改 vue.config.js
// 引入插件
const BuildVersionPlugin = require('build-version-plugin')
const pkg = require('./package.json')
// 添加注入插件
module.exports = {
configureWebpack: config => {
if (process.env.NODE_ENV !== 'development') {
config.plugins.push(
new BuildVersionPlugin(pkg)
)
}
}
VueCli2配置
修改 build 下修改 webpack.prod.conf.js
// 引入插件
const BuildVersionPlugin = require('build-version-plugin')
const pkg = require('../package.json')
// 添加注入插件
const webpackConfig = merge(baseWebpackConfig, {
plugins: [
new BuildVersionPlugin(pkg)
]
})
