uniapp 打包 H5 生成的js
文件,默认情况下是不包含版本号以及时间戳后缀。这样会导致H5新版打包上线后,用户依旧使用的是浏览器中缓存的老版js文件。文件更新滞后等现象。
第一种(推荐)
在根目录新建vue.config.js文件,粘贴以下代码
let filePath = '' let Timestamp = '' //编译环境判断,判断是否H5环境 if (process.env.UNI_PLATFORM === 'h5') { filePath = 'static/js/'; //打包文件存放文件夹路径 Timestamp = '.' + new Date().getTime();//时间戳 } module.exports = { configureWebpack: { // webpack 配置 解决js缓存的问题 output: { // 输出重构 打包编译后的 文件目录 文件名称 【模块名称.时间戳】 filename: `${filePath}[name]${Timestamp}.js`, chunkFilename: `${filePath}[name]${Timestamp}.js` }, }, }
第二个方法
在应用程序的入口文件(如 main.js 或 App.vue)uniapp项目:h5template.html 中添加时间戳。例如,您可以在 index.html 文件中添加以下代码:
var script = document.createElement('script'); script.src = '/js/app.js?' + new Date().getTime(); document.getElementsByTagName('head')[0].appendChild(script);
注意:这个方法可以生效,但是在电脑端调试的时候会看到一个报错,但是不影响使用,有知道完美解决的可以留言一下哦,感谢.
第三个方法
设置缓存,index.html页面,在请求头加入
<meta http-equiv="Expires" content="0"> <meta http-equiv="Pragma" content="no-cache"> <meta http-equiv="Cache-control" content="no-cache"> <meta http-equiv="Cache" content="no-cache">
手机页面通常在第一次加载后会进行缓存,然后每次刷新会使用缓存而不是去重新向服务器发送请求。如果不希望使用缓存可以设置no-cache。