vue项目打包自动更新版本号且自动刷新缓存

在项目根目录创建一个 version.js 文件!

const fs =require('fs');const path ='./package.json';functiongetPackageJson(){returnJSON.parse(fs.readFileSync(path));}try{let packageJson =getPackageJson();let version = packageJson.version;// 去除前缀 vif(version.startsWith('v')){
        version = version.slice(1);}let arr = version.split('.').map(item=>{let num =Number(item);if(isNaN(num)){thrownewError(`Invalid version number part: ${item}`);}return num;});if(arr[2]<9){
        arr[2]+=1;}elseif(arr[1]<9){
        arr[1]+=1;
        arr[2]=0;}else{
        arr[0]+=1;
        arr[1]=0;
        arr[2]=0;}const newVersion ='v'+ arr.join('.');
    packageJson.version = newVersion;

    fs.writeFileSync(path,JSON.stringify(packageJson,null,2));
    console.log(`Version updated to ${newVersion}`);}catch(error){
        console.error('Failed to update package.json:', error);
        process.exit(1);}

在项目package.json配置基础版本号

继续在package.json文件的打包命令里添加执行version代码

可以先到运行serve里面添加执行version代码查看package.json里的版本号是否生效

main.js里面添加清除缓存，刷新代码；简单粗暴

const version =require('../package.json').version
const versionStorage = localStorage.getItem('version')if(version != versionStorage){
  localStorage.clear()
  localStorage.setItem('version', version)setTimeout(()=>{
    window.location.reload(true)},500)}