Vue、React打包文件放在服务器,浏览器存在缓存问题的解决


因浏览器缓存原因导致vue 打包的文件 导致偶尔会出现不能即使更新最新代码。因此在打包的文件名中添加一个版本号以便浏览器能区分。

解决方法:找到webpack .prod.conf.js

   1.定义版本变量: const  Version = new Date().getTime(); // 这里使用的是时间戳 来区分 ,也可以自己定义成别的如:1.1

   2.修改要生成的js和css文件的配置项,把刚刚声明的版本拼接进要生成的文件名中;  

output: {
    path: config.build.assetsRoot,
    filename: utils.assetsPath('js/[name].[chunkhash].' + Version + '.js'),
    chunkFilename: utils.assetsPath('js/[id].[chunkhash].' + Version + '.js')
}

然后直接 npm run build 打包后 就可以看到dist 文件里的js 文件名带上里版本号

普通项目可以

<script>
  document.write('<script type="text/javascript" src="jquery.js?'+Math.random()+'"><\/script>');
</script>

 

原理:


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM