介绍
本篇内容主要讲解“vue项目中禁用浏览器缓存的配置步骤”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“vue项目中禁用浏览器缓存的配置步骤”吧!
<强>项目发布版本会遇到经常需要清理缓存的问题,以下是项目禁用缓存的实际方法强>
<强> 1。公共文件夹中修改指数。html文件元配置强>
& lt; meta http-equiv=皃ragram",内容=皀o-cache",/比; ,,,& lt; meta http-equiv=癱ache-control",内容=皀o - cache,,不是商店,,must-revalidate",/比; ,,,& lt; meta http-equiv=癳xpires",内容=?“,/在
<强> 2。vue cli构建配置(针对vue3以下版本)强>
在vue.config。js新增配置
const Timestamp =, new 日期().getTime () module.exports =, { ,,configureWebpack: { 输出:,,,,{,//输出重构,,打包编译后的,文件名称,,【模块名称。版本号(可选)。时间戳】 ,,,,,文件名:,“[名字]。${时间戳}. js ', ,,,,,chunkFilename:,“[名字]。${时间戳}. js ' ,,,}, ,,}, css才能:{ ,,,精华:,{,//打包后css文件名称添加时间戳 ,,,,,文件名:,“css/[名字]。${时间戳}. css ', ,,,,,chunkFilename:,“css/[名字]。${时间戳}. css” ,,,} ,,}, }
<强> 3。Nginx配置强>
禁用掉Nginx缓存,让浏览器每次到服务器去请求文件,而不是在浏览器中读取缓存文件。
当程序调试好上线后,可以开启Nginx缓存,节省服务器的带宽流量,减少一些请求,降低服务器的压力。
在Nginx。参看文件里配置html文件默认加头不缓存配置
以下实际项目中nginx缓存配置
,,的位置~,。* \。(?:htm | html)美元,{ ,,,add_header Cache-Control “私人的,,不是商店,,no - cache,, must-revalidate, proxy-revalidate"; 以前,,}>Nginx静态资源缓存设置,https://codecat.blog.csdn.net/article/details/117604817
vue项目中禁用浏览器缓存的配置步骤