Vue项目部署后提示刷新版本的实现代码

/***
 * title: versionWebpackPlugin.js
 * Author: Gaby
 * Email: 
 * Time: 2022-06-27 14:24
 * LastEditTime: 2022-06-27 14:24
 * LastEditors: Gaby
 * Description:
 */

const fs = require('fs');
const path = require('path');
const config = require('../package.json');
const readFile = filePath => fs.readFileSync(filePath, 'utf8');
const resolve = (...dir) => path.resolve(__dirname, '..', ...dir);
const resolveApp = (...dir) => resolve('src', ...dir);
const pluginName = 'versionWebpackPlugin';
const versionFileName = 'version.json';

class versionWebpackPlugin {
  apply(compiler) {
    // 1.自动注入到 webpack.entry
    compiler.options.entry.app.import = [
      ...compiler.options.entry.app.import,
      ...['./src/libs/version.js']
    ];

    // 2.将版本号写入到 main 文件中
    compiler.hooks.beforeRun.tap(pluginName, () => {
      let content = readFile(resolve('build/', 'version.js'));
      let string = content.toString();
      string = string.replace(
        '{{currentVersion}}',
        config.version + '_' + Date.now()
      );
      string = string.replace(
        '{{VERSION_FILE_PATH}}',
        'static/' + versionFileName
      );
      fs.writeFile(resolve('src/libs/', 'version.js'), string, () => {
        // console.log('更新完成');
      });

      fs.writeFile(
        resolve('static/', versionFileName),
        '{\n' +
          '  "version": "' +
          config.version +
          '_' +
          Date.now() +
          '"\n' +
          '}',
        () => {
          // console.log('更新完成');
        }
      );
    });
}
module.exports = versionWebpackPlugin;

const path = require('path');
// const versionPlugin = require('./build/version-webpack-plugin');

module.exports = {
  // 公共路径(必须有的) 默认/
  publicPath: './',
  // 输出文件目录 默认dist
  outputDir: 'dist',
  // 静态资源存放的文件夹(相对于outputDir) 默认根目录
  assetsDir: 'static',
  // 生产环境SourceMap关
  productionSourceMap: false,
  // webpack 全局变量配置
  configureWebpack: {
    // plugins: [new versionPlugin()]
  },
  chainWebpack: config => {
    config
      .plugin('version-webpack-plugin')
      .use(require('./build/version-webpack-plugin'), [{}]);
  }
};