IT俱乐部 JavaScript vue项目打包自动更新版本号且自动刷新缓存的方法示例

vue项目打包自动更新版本号且自动刷新缓存的方法示例

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

const fs = require('fs');
const path = './package.json';

function getPackageJson() {
    return JSON.parse(fs.readFileSync(path));
}

try {
    let packageJson = getPackageJson();
    let version = packageJson.version;
    // 去除前缀 v
    if (version.startsWith('v')) {
        version = version.slice(1);
    }
    let arr = version.split('.').map(item => {
        let num = Number(item);
        if (isNaN(num)) {
            throw new Error(`Invalid version number part: ${item}`);
        }
        return num;
    });

    if (arr[2] 

在项目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)
}

总结 

到此这篇关于vue项目打包自动更新版本号且自动刷新缓存的文章就介绍到这了,更多相关vue项目打包自动更新版本号内容请搜索IT俱乐部以前的文章或继续浏览下面的相关文章希望大家以后多多支持IT俱乐部!

本文收集自网络,不代表IT俱乐部立场,转载请注明出处。https://www.2it.club/navsub/js/14183.html
上一篇
下一篇
联系我们

联系我们

在线咨询: QQ交谈

邮箱: 1120393934@qq.com

工作时间:周一至周五,9:00-17:30,节假日休息

关注微信
微信扫一扫关注我们

微信扫一扫关注我们

返回顶部