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

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

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的方法和类

    面向过程与面向对象都是我们编程中,编写程序的一种思维方式.例如:公司打扫卫生(擦玻璃.扫地.拖地.倒垃圾等), 按照面向过程的程序设计方式会思考“打扫卫生我该怎么做,然后一件件的完成”,最后把公司卫生 ...

  2. setTimeout的实现原理以及setTimeout(0)的使用场景

      先看一段代码: var start = new Date(); setTimeout(function(){ var end = new Date(); console.log("Tim ...

  3. Vue基础知识之vue-resource和axios

    Vue基础知识之vue-resource和axios  原文链接:http://www.cnblogs.com/Juphy/p/7073027.html vue-resource Vue.js是数据驱 ...

  4. 在 Eclipse Juno 上安装 Marketplace

    Select Help/Install new software... from the menu, select the Juno update site (http://download.ecli ...

  5. bit byte 字 字节 关系 简列

    字 word 字节 byte 位 bit 字长是指字的长度 1字=2字节(1 word = 2 byte = 16bit) 1字节=8比特(1 byte = 8bit) 1比特=1位 一个字的字长为1 ...

  6. Protobuf协议的Java应用例子

    Protobuf协议,全称:Protocol Buffer 它跟JSON,XML一样,是一个规定好的数据传播格式.不过,它的序列化和反序列化的效率太变态了…… 来看看几张图你就知道它有多变态. Pro ...

  7. linux中启动网卡报错:Bringing up interface eth1: Error: Connection activation failed

    在重启linux网络服务的时候提示: Active connection path: /org/freedesktop/NetworkManager/ActiveConnection/2 并且产生报错 ...

  8. # putty的使用和保存配置

    putty的使用和保存配置 之前使用的xshell5,但是突然之间需要我去注册,根本无法使用.在网上看到可以到官网申请家庭和学校版本,但是我的邮箱一直没有接收到邮件.于是我放弃xshell.就拿起了之 ...

  9. 一点一点学写Makefile-1

    相信很多Linux开发者 都得自己来写Makefile,刚开始学习学写这个的时候都会碰到很多困难,我之前没有自己独立完成过Makefile,都是在公司已有的模板上添加.现在突然有一个很大的想法就是从零 ...

  10. 如何使用Kubernetes的configmap通过环境变量注入到pod里

    在Kubernetes官网里,有这样一篇文章,提到了Kubernetes里的一个最佳实践就是把应用代码同配置信息分开,一种方式就是使用Kubernetes 1.2里引入的configmap概念. ht ...