vue增加强缓存和版本号的实现方法

强缓存：

什么是强缓存？强在哪里？事实上，强大意味着被迫。当浏览器请求一个文件时，服务器将更改的文件缓存在响应头中。缓存时间和缓存类型由服务器控制。

强缓存实现：

cache-control : max-age=315360000，公共的、不可变的客户端和代理服务器可以缓存这个资源，在315360000秒(10年)的有效期内，如果有需要请求这个资源，缓存会直接读取，statu code:200，即使用户做了刷新操作，也不会向服务器发送http请求。

参考文章“彻底理解强缓存和协商缓存”

Index.html文件采用协商缓存，原因是每次用户请求index.html时，他都会直接请求服务器而不是浏览器缓存，这样才能保证资源得到更新，所以切记不要设置强缓存！

其他资源使用强缓存协商缓存，因此没有理由这样做。

Nginx配置

中的版本号管理。环境生产生产模式。环境测试测试模式

VUE_APP_VERSION=T0.01测试模式VUE_APP_VERSION=V0.01生产模式在package.json中配置了Package命令

Npm运行构建版本号为V0.01的正式环境npm运行构建版本号为T0.01的测试环境通过webpack进行打包和设置，名称版本号timestamp.js。

您可以根据服务器设置强缓存和缓存静态文件

配置web pack : { output : {//输出重构、打包、编译后的文件名[模块名。版本号。时间戳]文件名： `[名称]。$ {process。环境。vue _ app _ version}。$ {timestamp}。js `，Chunk文件名： `[名称]。$ {process。环境。vue _ app _ version}。$ {timestamp}。js `，}，}以上就是本文的全部内容。希望对大家的学习有帮助，支持我们。