vue项目中缓存问题
单页面应用总是存在缓存问题,特别是在微信端,更新页面之后访问的还是老页面,缓存的问题是因为用户访问的脚本地址并没有改变,浏览器就会读取原来的脚本
网上有几种解决办法,首先列举一下
1.加meta,禁止页面缓存

如果有些功能需要页面缓存的话这种方式就不适用,而且禁止缓存之后用户的请求的次数就会增多,流量消耗过快。
2.手动改变脚本地址,webpack打包的时候加一个版本号,这样每次打包的脚本路径就不同,浏览器就会重新读取脚本,解决缓存问题,上图说话

在config下的index.js中加一个version变量,然后修改assetsSubDirectory,然后打包之后就会是下图这种

这种测试过,有一个问题,就是项目中css中如果有使用背景图,背景图就会找不到,图片路径有问题,目前我没有办法解决,如果有大佬能解决,可以留言,多谢
3.加时间戳的方法,html页面加载脚本的时候给脚本后面加一个时间戳,原理和第二种一样,改变路径。直接上图

按照图上面加一个hash属性,获取时间戳

这是没加之前的

这是加过之后的
vue项目中缓存问题的更多相关文章
- <转载> VUE项目中CSS管理
vue的scoped 在vue项目中,当 .vue文件中 <style> 标签有 *scoped 属性时,它的 CSS 只作用于当前组件中的元素,很好的实现了样式私有化的目的. 使用sco ...
- vue项目中遇到的一些问题
或访问:https://github.com/littleHiuman/experiences-about-vue 欢迎补充! vuex 状态 vue-cli 命令行 vue vue vue-rou ...
- Vue项目中出现Loading chunk {n} failed问题的解决方法
最近有个Vue项目中会偶尔出现Loading chunk {n} failed的报错,报错来自于webpack进行code spilt之后某些bundle文件lazy loading失败.但是这个问题 ...
- vue项目中使用bpmn-流程图预览篇
前情提要 上文已经实现了节点操作的前进.后退.导入.导出等操作,今日来实现“流程图预览”,以及视图的放大缩小 前提:项目安装过bpmn,安装可见上篇文章 实现要点 bpmn提供了两个神器:Modele ...
- vue 项目中实用的小技巧
# 在Vue 项目中引入Bootstrap 有时在vue项目中会根据需求引入Bootstrap,而Bootstrap又是依赖于jQuery的,在使用npm按照时,可能会出现一系列的错误 1.安装jQu ...
- 如何在VUE项目中添加ESLint
如何在VUE项目中添加ESLint 1. 首先在项目的根目录下 新建 .eslintrc.js文件,其配置规则可以如下:(自己小整理了一份),所有的代码如下: // https://eslint.or ...
- 在vue项目中, mock数据
1. 在根目录下创建 test 目录, 用来存放模拟的 json 数据, 在 test 目录下创建模拟的数据 data.json 文件 2.在build目录下的 dev-server.js的文件作如下 ...
- 浅谈 Axios 在 Vue 项目中的使用
介绍 Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中. 特性 它主要有如下特性: 浏览器端发起XMLHttpRequests请求 Node端发起http ...
- 去除vue项目中的#及其ie9兼容性
一.如何去除vue项目中访问地址的# vue2中在路由配置中添加mode(vue-cli创建的项目在src/router/index.js) export default new Router({ m ...
随机推荐
- css box-shadow知识点及多重边框
box-shadow() 参数: h-shadow:水平阴影的位置.允许负值. v-shadow:垂直阴影的位置.允许负值. blur:模糊距离. spread:扩张半径(可正可负.投影面积则可大可小 ...
- 在windows环境下运行compass文件出现的错误提示解决方案
在windows环境下运行compass文件出现的错误提示解决方案 例如:经常在项目中运行grunt命令编译scss文件的时候,会出现下面的错误提示 (Encoding::CompatibilityE ...
- 数据结构复习之C语言malloc()动态分配内存概述
#include <stdio.h> #include <malloc.h> int main(void) { ] = {, , , , }; // 计算数组元素个数 ]); ...
- Spring应用开发常见规范
1.Spring应用开发常见包命名规范 controller:控制器 service:服务-接口 impl:服务-实现 integration sao:调用其他模块的,把feign的调用放到这个下面 ...
- 转:ITopologicalOperator Buffer调用异常的解决方法(来源网络)
/// <summary> /// 用拓扑分析求出缓冲区范围. /// 由于ArcGIS的问题,有时调用会出异常,因此需要循环调用 /// </summary> ...
- Android 自定义Dialog中加EditText弹不出键盘跟Dialog遮挡键盘的问题
先上两张图 第一张问题很明显,第二张是成功的图, 其实第一张是加了 //getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INP ...
- Qt之QSS(样式表语法)
http://blog.csdn.net/liang19890820/article/details/51691212 版权声明:进步始于交流,收获源于分享!纯正开源之美,有趣.好玩.靠谱...作者: ...
- Web测试中定位bug方法
在web测试过程中,经常会遇到页面中内容或数据显示错误,甚至不显示,第一反应就是BUG,没错,确实是BUG.进一步了解这个BUG的问题出在那里,是测试人员需要掌握的,可以简单的使用浏览器自带开发者工具 ...
- ZT 困难是什么?困
困难是什么?困难就是摆在我们面前的山峰,需要我们去翻越;困难就是摆阻碍我们前行的巨浪,需要我们扬帆劈刀斩浪航行:困难就是我们眼前所下的暴风雨,要坚信暴风雨过后会有阳光和彩虹. 其实困难并不可怕,怕的就 ...
- 第一次团队合作,对Scrum的初步了解
学习和运用scrum 作为长大的大三老腊肉,我们已经在长大生活了两年多,对于什么是长大人最想完善的校园需求.最想拥有的校园服务媒介也有了更加深切的体会. 于是,GoodJob小团队blingbling ...