怎么在vue中增加强缓存和版本号

  介绍

怎么在vue中增加强缓存和版本号?相信很多没有经验的人对此束手无策,为此本文总结了问题出现的原因和解决方法,通过这篇文章希望你能解决这个问题。

<强>强缓存:

怎么在vue中增加强缓存和版本号”> <br/> </p> <p>强缓存实现:</p> <pre类= cache - control:,, public 信息=315360000,不变的

客户端和代理服务器都可以缓存该资源,在315360000秒(10年)的有效期内,如果有请求该资源的需求的话就直接读取缓存,该队代码:200,即使用户做了刷新操作,也不向服务器发起http请求

参考文章“彻底弄懂强缓存与协商缓存“

index . html文件采用协商缓存,理由就是要用户每次请求指数。html不拿浏览器缓存,直接请求服务器,这样就保证资源更新了,切记不要设置强缓存! ! !

其他资源采用强缓存+协商缓存,理由就不多说了。

<强> nginx配置

怎么在vue中增加强缓存和版本号

<强>版本号管理在

.env。生产生产模式

.env。测试测试模式

VUE_APP_VERSION =, T0.01 测试模式   时间=VUE_APP_VERSION  V0.01 生产模式

在包中。json配置了打包命令

npm  run  build ,,正式环境配V0.01版本号   npm  run 构建:test 测试环境配T0.01版本号

通过webpack打包设置,名字+版本号+时间戳。js

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

configureWebpack:, {   输出:,,,,{,//输出重构,打包编译后的,文件名称,【模块名称。版本号。时间戳】   ,,,,,文件名:,“[名字]。$ {process.env.VUE_APP_VERSION}。${时间戳}. js”,   ,,,,,chunkFilename:,“[名字]。$ {process.env.VUE_APP_VERSION}。${时间戳}. js”,   ,,,,},   } Vue的优点

Vue具体轻量级框架,简单易学,双向数据绑定,组件化,数据和结构的分离,虚拟DOM,运行速度快等优势,Vue中页面使用的是局部刷新,不用每次跳转页面都要请求所有数据和DOM,可以大大提升访问速度和用户体验。

看完上述内容,你们掌握怎么在Vue中增加强缓存和版本号的方法了吗?如果还想学到更多技能或想了解更多相关内容,欢迎关注行业资讯频道,感谢各位的阅读!

怎么在vue中增加强缓存和版本号