根据之前的配置,假设文件上传至服务器中,没有加hash,如果页面内容有更改,浏览器刷新的时候,请求的还是原先的文件,也就是浏览器的缓存,因为名字没有变。现在我们在上线的webpack配置中加上hash
output:{
  filename: '[name].[contenthash].js',
  chunkFilename: '[name].[contenthash].js',
}

这个时候打包出来的文件就有了hash值。只要文件内容不变,hash值就不变,内容变了才变。

如果打包失效,比如老版本的webpack4。这个时候加一个配置参数
optimization:{
  runtimeChunk: {
    name: 'runtime'
  }
}

webpack与浏览器缓存的更多相关文章

  1. webpack分离第三方库(CommonsChunkPlugin并不是分离第三方库的好办法DllPlugin科学利用浏览器缓存)

    webpack算是个磨人的小妖精了.之前一直站在glup阵营,使用browserify打包,发现webpack已经火到爆炸,深怕被社区遗落,赶紧拿起来把玩一下.本来只想玩一下的.尝试打包了以后,就想启 ...

  2. CommonsChunkPlugin并不是分离第三方库的好办法(DllPlugin科学利用浏览器缓存)

    webpack算是个磨人的小妖精了.之前一直站在glup阵营,使用browserify打包,发现webpack已经火到爆炸,深怕被社区遗落,赶紧拿起来把玩一下.本来只想玩一下的.尝试打包了以后,就想启 ...

  3. nginx 与 浏览器缓存

    一.本地静态文件 location /html/{ rewrite ^(html/.*)$ /$1 break; root /data/static; expires 12h; etag off; i ...

  4. 解决微信浏览器缓存站点入口文件(IIS部署Vue项目)

    最近开发的微信公众号项目中(项目采用Vue + Vux 构建,站点部署在IIS8.5上),遇到个非常奇葩的问题,发布站点内容后,通过微信打开网址发现是空白页面(后来验证是微信浏览器缓存了入口文件-in ...

  5. web性能优化:详说浏览器缓存

    TOC 背景 浏览器的总流程图 一步一步说缓存 朴素的静态服务器 设置缓存超时时间 html5 Application Cache Last-Modified/If-Modified-Since Et ...

  6. 理解web缓存 浏览器缓存

    为了: 控制缓存 遇到的现象: 1.开发的时候,浏览器会缓存你的文件,使得你的改动是无效的! 开发过程中:我们是不希望有缓存的. 但正是发布以后,我们是希望页面能够在浏览器缓存,这样用户的体验就会提高 ...

  7. nginx,控浏览器缓存,前端优化方案

    1,困惑 做web项目,对于开发者来说,一个最头痛的问题就是浏览器缓存,有缓存,js更改了,html更改了,发布服务器以后用户往往无法通过浏览器访问到最新的类容,需要用户主动去刷新页面, 因为一直做企 ...

  8. 关于引用JS和CSS刷新浏览器缓存问题

    有时候我们会碰到上线的新版本都要刷新一次缓存的问题.那是因为改了JS的内容,但是JSP引用的地方后面的字符串未发生改变导致浏览器读取浏览器缓存而不会重新加载新的JS内容,以下提供两种解决方式: 1.每 ...

  9. 浏览器缓存相关的Http头介绍:Expires,Cache-Control,Last-Modified,ETag

    转自:http://www.path8.net/tn/archives/2745 缓存对于web开发有重要作用,尤其是大负荷web系统开发中. 缓存分很多种:服务器缓存,第三方缓存,浏览器缓存等.其中 ...

随机推荐

  1. iCMSv7.0.15后台database.admincp文件仍存在SQL注入漏洞

    闲着无聊,国庆时间没事做,又在Q群看到这种公告,只好下个icms慢慢玩.(PS:医院和学校居然都关网站了) 无奈自己太菜,审不出问题.只好上网百度icms之前的漏洞.然后居然成功在iCMSv7.0.1 ...

  2. 原装win8系统电脑崩溃问题解决

    原装win8系统电脑崩溃问题解决 声明:引用请注明出处http://blog.csdn.net/lg1259156776/ 说明:之所以撰写本篇关于win8原装系统电脑崩溃的博文,一是要吐槽一下原装w ...

  3. with as用法 --Python

    有些任务,可能事先设置,时候做清理工作,如下面一段程序: f = open('tmp.txt') data = f.read() print(data) 是不是忘了什么?没错,很明显忘记关闭文件句柄. ...

  4. python3.7 完美安装

    在安装python3.7的过程中,我发现如果不加注意,pip3是无法被安装的.而这就不能算是完整安装python3了. 所以,我总结一下,如何完美安装python3.7.   依赖 yum insta ...

  5. 第一个web 程序(servlet 和 jsp )&

    开发工具是便于程序员的编写,真正运行的代码不是编写的代码,而是tomcat服务器中部署好的代码.tomcat 会根据请求自动调用对应的代码进行请求处理. 可能遇到的问题: 1. 没有classes文件 ...

  6. webstorm对引入的css资源进行提示

  7. 【牛客网】Idol Master

    [牛客网]Idol Master 也是一道网络流解线性规划 不过需要从小于号的那边解 限制是\(a \leq \sum_{i = 1}^{k} x_{i}\leq b\) 其中\(0 \leq x_{ ...

  8. 用css美化select框

    先上代码: .selectData{ height: 0.42rem; position: absolute; right:.28rem; top:.30rem; //去边框 border: none ...

  9. List 集合的常用方法总结

    @org.junit.Test public void testListToCompare() { List<String> list1 = new ArrayList<>() ...

  10. eventFlow 系列 <三> 查询所有

    接着上面的例子,产生2条数据.怎么把这两条数据查询出来呢? var commandBus = resolver.Resolve<ICommandBus>(); , ); var execu ...