单页面应用总是存在缓存问题,特别是在微信端,更新页面之后访问的还是老页面,缓存的问题是因为用户访问的脚本地址并没有改变,浏览器就会读取原来的脚本

网上有几种解决办法,首先列举一下

1.加meta,禁止页面缓存

如果有些功能需要页面缓存的话这种方式就不适用,而且禁止缓存之后用户的请求的次数就会增多,流量消耗过快。

2.手动改变脚本地址,webpack打包的时候加一个版本号,这样每次打包的脚本路径就不同,浏览器就会重新读取脚本,解决缓存问题,上图说话

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

这种测试过,有一个问题,就是项目中css中如果有使用背景图,背景图就会找不到,图片路径有问题,目前我没有办法解决,如果有大佬能解决,可以留言,多谢

3.加时间戳的方法,html页面加载脚本的时候给脚本后面加一个时间戳,原理和第二种一样,改变路径。直接上图

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

这是没加之前的

这是加过之后的

vue项目中缓存问题的更多相关文章

  1. <转载> VUE项目中CSS管理

    vue的scoped 在vue项目中,当 .vue文件中 <style> 标签有 *scoped 属性时,它的 CSS 只作用于当前组件中的元素,很好的实现了样式私有化的目的. 使用sco ...

  2. vue项目中遇到的一些问题

    或访问:https://github.com/littleHiuman/experiences-about-vue  欢迎补充! vuex 状态 vue-cli 命令行 vue vue vue-rou ...

  3. Vue项目中出现Loading chunk {n} failed问题的解决方法

    最近有个Vue项目中会偶尔出现Loading chunk {n} failed的报错,报错来自于webpack进行code spilt之后某些bundle文件lazy loading失败.但是这个问题 ...

  4. vue项目中使用bpmn-流程图预览篇

    前情提要 上文已经实现了节点操作的前进.后退.导入.导出等操作,今日来实现“流程图预览”,以及视图的放大缩小 前提:项目安装过bpmn,安装可见上篇文章 实现要点 bpmn提供了两个神器:Modele ...

  5. vue 项目中实用的小技巧

    # 在Vue 项目中引入Bootstrap 有时在vue项目中会根据需求引入Bootstrap,而Bootstrap又是依赖于jQuery的,在使用npm按照时,可能会出现一系列的错误 1.安装jQu ...

  6. 如何在VUE项目中添加ESLint

    如何在VUE项目中添加ESLint 1. 首先在项目的根目录下 新建 .eslintrc.js文件,其配置规则可以如下:(自己小整理了一份),所有的代码如下: // https://eslint.or ...

  7. 在vue项目中, mock数据

    1. 在根目录下创建 test 目录, 用来存放模拟的 json 数据, 在 test 目录下创建模拟的数据 data.json 文件 2.在build目录下的 dev-server.js的文件作如下 ...

  8. 浅谈 Axios 在 Vue 项目中的使用

    介绍 Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中. 特性 它主要有如下特性: 浏览器端发起XMLHttpRequests请求 Node端发起http ...

  9. 去除vue项目中的#及其ie9兼容性

    一.如何去除vue项目中访问地址的# vue2中在路由配置中添加mode(vue-cli创建的项目在src/router/index.js) export default new Router({ m ...

随机推荐

  1. Java访问控制权限

    在Java中一共存在四种访问控制权限,即 private.default(默认).protected和public 1.private 访问权限 private属于私有访问权限,可以用在属性的定义.方 ...

  2. JSP初学者5

    JSP中include指令和include动作的区别 include指令是编译阶段的指令,即include所包含的文件的内容是编译的时候插入到JSP文件中,  JSP引擎在判断JSP页面未被修改,否则 ...

  3. PHP time() date() strtotime()日期函数总结

    日期函数总结—— 一.返回时间戳——若整体数值超出计算机能力范围,返回空. 1. time();返回当前的 Unix 时间戳  例:$a=time(); var_dump($a); //输出:int( ...

  4. 再学UML-深入浅出UML类图(二)

    类与类之间的关系(1) 在软件系统中,类并不是孤立存在的,类与类之间存在各种关系,对于不同类型的关系,UML提供了不同的表示方式.       1. 关联关系 关联(Association)关系是类与 ...

  5. Struts的学习-配置

    1.进入官网http://struts.apache.org/download.cgi#struts2513,这里为下载地址,(ps:struts-2.5.13-all版本). 2.将..\strut ...

  6. June 11th 2017 Week 24th Sunday

    I hope I can find the one who is afraid of losing me. 我希望找到一个担心失去我的人. When I was young, sometimes I ...

  7. POJ-3579 Median---二分第k大(二分套二分)

    题目链接: https://cn.vjudge.net/problem/POJ-3579 题目大意: 求的是一列数所有相互之间差值的序列的最中间的值是多少. 解题思路: 可以用二分套二分的方法求解第m ...

  8. Android(java)学习笔记44:Map集合的遍历之键值对对象找键和值

    1. Map集合的遍历之 键值对对象找 键和值: package cn.itcast_01; import java.util.HashMap; import java.util.Map; impor ...

  9. POJ 2985 名次树

    题意:1~n个猫,有合并操作,有询问操作,合并两只猫所在的集合,询问第K大的集合. 分析:合并操作用并查集,用size维护,询问操作用Treap.注意优化,不能刚开始就把所有size = 1放到名次树 ...

  10. Northwind数据库不能在SQL Server 2012上创建

    附加mdf文件不出意料会提示数据库格式无法兼容,试着通过脚本来创建,会有以下错误提示: Could not find stored procedure 'sp_dboption'. 原因是SQL Se ...