<万博manbetx平台>vue项目中禁用浏览器缓存配置案例 - 万博manbetx平台中文网

vue项目中禁用浏览器缓存配置案例

这篇文章主要介绍了vue项目中禁用浏览器缓存配置案例,本篇文章通过简要的案例,讲解了该项技术的了解与使用,以下就是详细内容,需要的朋友可以参考下

项目发布版本会遇到经常需要清理缓存的问题,以下是项目禁用缓存的实际方法

1.public文件夹中修改 index.万博manbetx平台文件meta配置

image.png-600

 

2.vue cli 构建配置(针对vue3以下版本)

在vue.config.js新增配置

 const Timestamp = new Date().getTime() module.exports = { configureWebpack: { output: { // 输出重构  打包编译后的 文件名称  【模块名称.版本号(可选).时间戳】 filename: `[name].${Timestamp}.js`, chunkFilename: `[name].${Timestamp}.js` }, }, css: { extract: { // 打包后css文件名称添加时间戳 filename: `css/[name].${Timestamp}.css`, chunkFilename: `css/[name].${Timestamp}.css` } }, }

3.Nginx配置

禁用掉nginx缓存,让浏览器每次到服务器去请求文件,而不是在浏览器中读取缓存文件。

当程序调试好上线后,可以开启nginx缓存,节省服务器的带宽流量,减少一些请求,降低服务器的压力。

image.png-600

在nginx.conf文件里配置万博manbetx平台文件默认加header 不缓存配置

以下实际项目中nginx缓存配置

 location ~ .*\.(?:htm|万博manbetx平台)$ { add_header Cache-Control "private, no-store, no-cache, must-revalidate, proxy-revalidate"; }

Nginx静态资源缓存设置 https://www.762w6o.com/article/222620.htm

到此这篇关于vue项目中禁用浏览器缓存配置案例的文章就介绍到这了,更多相关vue项目中禁用浏览器缓存配置内容请搜索万博manbetx平台中文网以前的文章或继续浏览下面的相关文章希望大家以后多多支持万博manbetx平台中文网!

以上就是vue项目中禁用浏览器缓存配置案例的详细内容,更多请关注万博manbetx平台中文网其它相关文章!

赞(0) 打赏
未经允许不得转载:万博manbetx平台中文网首页 » Vue.js 教程

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

前端开发相关广告投放 更专业 更精准

联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏