每次打包更新版本发到服务器上,导致偶尔会出现不能即使更新最新代码,浏览器存在缓存的问题。

解决方法:找到webpack .prod.conf.js

1.定义版本变量: const  Version = new Date().getTime(); // 这里使用的是时间戳 来区分

output: {
path: config.build.assetsRoot,
filename: utils.assetsPath('js/[name].[chunkhash].'+_Version+'js'),
chunkFilename: utils.assetsPath('js/[id].[chunkhash].'+_Version+'js')
},

然后直接 npm run build 打包后 就可以看到dist 文件里的js 文件名带上里版本号

但是 ,我们发现 vue-cli里的默认配置,css和js的名字都加了哈希值,所以新版本css、js和就旧版本的名字是不同的,不会有缓存问题。那么就可能是打包好的index.html放到服务器里去的时候,index.html在服务器端可能是有缓存的,这需要在服务器配置不让缓存index.html

2、nginx 配置,让index.html不缓存

在开发调试web的时候,经常会碰到因浏览器缓存(cache)而经常要去清空缓存或者强制刷新来测试的烦恼,提供下apache不缓存配置和nginx不缓存配置的设置。在常用的缓存设置里面有两种方式,都是使用add_header来设置:分别为Cache-Control和Pragma。

add_header Cache-Control no-store;
add_header Pragma no-cache;

no-cache浏览器会缓存,但刷新页面或者重新打开时 会请求服务器,服务器可以响应304,如果文件有改动就会响应200 
no-store浏览器不缓存,刷新页面需要重新下载页面

Vue打包文件放在服务器后,浏览器存在缓存问题的更多相关文章

  1. Vue打包文件放在服务器,浏览器存在缓存问题的解决

    在入口文件index.html添加 <meta http-equiv="pragram" content="no-cache"> <meta ...

  2. Vue 打包部署到服务器后,非主页刷新后出现404问题解决

    开心把项目部署到服务上,从头到尾点了一遍,发现没有问题,以为就可以大功告成,没想到刷新页面时出现 被破泼了一脸的凉水,更奇怪的事首页没有问题,只有其他页面出现,在调戏了很久的度娘后,才从坑里跳出来,以 ...

  3. nginx处理vue打包文件后的跨域问题

    起因 在vue文件打包后,项目脱离了vue配置的反向代理配置,还是会报跨域的错误,或者直接打不开本地文件, 但是此刻我们想打开打包后的文件,测试一下文件有没有错误,因为经常会存在开发阶段没有问题,打包 ...

  4. vue+ elementUI 打包发布到服务器后,element-icons.woff文件404

    vue项目打包部署到服务器,静态资源文件404 js文件404问题        原因:打包的项目静态资源的路径需要设置为绝对路径.如果是相对路径会出错 解决办法:修改config/index.js文 ...

  5. vue代码上传服务器后背景图片404解决方法

    问题:代码上传服务器后,图片404,使用的font-awesome图标也是404 解决办法: 如果你用了vue-cil,那么在build目录下找到utils.js中的ExtractTextPlugin ...

  6. 使用node-static运行vue打包文件dist

    vue打包后的文件dist,如果想上线之前查看效果,方法如下: npm install -g node-static 进入到dist文件夹,运行static命令 打开上面地址

  7. vue 打包部署到服务器上 配置nginx访问

    坑一 css,js资源引入不正确 webpack配置文件config/index.js 需要更改: 方法一 当部署到带有文件夹的项目中,这种绝对路径就会出现问题,因为把配置的static文件夹当成了根 ...

  8. Vue打包发布到Tomcat后,刷新报错404解决方法

    在应用下面加 WEB-INF 建 web.xml 内容如下 <?xml version="1.0" encoding="ISO-8859-1"?> ...

  9. Vue匿名组件使用keep-alive后动态清除缓存

    在使用Vue开发管理系统项目的时候,为了保存页面的浏览状态,我们可以使用内置组件keep-alive来缓存组件内部状态,避免重新渲染. <keep-alive> <router-vi ...

随机推荐

  1. 7.MapReduce操作Hbase

    7 HBase的MapReduce   HBase中Table和Region的关系,有些类似HDFS中File和Block的关系.由于HBase提供了配套的与MapReduce进行交互的API如 Ta ...

  2. Juit

    Junit这种老技术,现在又拿出来说,不为别的,某种程度上来说,更是为了要说明它在项目中的重要性. 凭本人的感觉和经验来说,在项目中完全按标准都写Junit用例覆盖大部分业务代码的,应该不会超过一半. ...

  3. Java基础 TreeSet()来实现数组的【定制排序】 : Comparable接口(自然排序) 或者 Comparator接口 (定制排序)

    笔记: //排序真麻烦!没有C++里的好用又方便!ORZ!ORZ!数组排序还还自己写个TreeSet()和( Comparable接口(自然排序) 或者 Comparator接口 (定制排序))imp ...

  4. PHP获取不到url传递参数中#&等特殊字符解决方法

    有些符号在URL中是不能直接传递的,无法传入PHP处理,比如#&等符号,通过$_GET是获取不到的,比如一个域名https://localhost/url.php?url=yangyufei+ ...

  5. 删除集合元素Collection ,remove()

    package seday11;/*** @author xingsir*/public class coordinate { private int x; private int y; /* * 右 ...

  6. postgresql backup

    #!/bin/sh # Database backup script # Backup use postgres pg_dump command: # pg_dump -U <user> ...

  7. 2019HDU多校第六场 6641 TDL——乱搞&&思维题

    题意 设 $f(n, m)$ 为大于 $n$ 且与 $n$ 互质的数中第 $m$ 小的数,求满足 $(f(n, m) - n) \oplus n = k$ 的最小正整数 $n$ 分析 因为 $m \l ...

  8. 2019牛客多校第五场generator2——BSGS&&手写Hash

    题目 几乎原题 BZOJ3122题解 分析 先推一波公式,然后除去特殊情况分类讨论,剩下就是形如 $a^i \equiv b(mod \ p)$ 的方程,可以使用BSGS算法. 在标准的BSGS中,内 ...

  9. SqlBulkCopy插入时:来自数据源的 String 类型的给定值不能转换为指定目标列的类型 int。 ---> System.FormatException: 将参数值从 String 转换到 Int32 失败。 ---> System.FormatException: 输入字符串的格式不正确。

    偶尔间看到的 记录下:https://bbs.csdn.net/topics/390430064

  10. xpath简介备查

    xpath简介 xpath 使用路径表达式在xml和html中进行导航 xpath包含标准函数库 xpath是一个w3c的标准 xpath节点关系 父节点 子节点 同袍节点 先辈节点 后代节点 xpa ...