webpack中的hash、chunkhash、contenthash区别
hash一般是结合CDN缓存来使用,通过webpack构建之后,生成对应文件名自动带上对应的MD5值。如果文件内容改变的话,那么对应文件哈希值也会改变,对应的HTML引用的URL地址也会改变,触发CDN服务器从源服务器上拉取对应数据,进而更新本地缓存。但是在实际使用的时候,这几种hash计算还是有一定区别。
1、hash
hash是跟整个项目的构建相关,只要项目里有文件更改,整个项目构建的hash值都会更改,并且全部文件都共用相同的hash值
2、chunkhash
采用hash计算的话,每一次构建后生成的哈希值都不一样,即使文件内容压根没有改变。这样子是没办法实现缓存效果,我们需要换另一种哈希值计算方式,即chunkhash。
chunkhash和hash不一样,它根据不同的入口文件(Entry)进行依赖文件解析、构建对应的chunk,生成对应的哈希值。我们在生产环境里把一些公共库和程序入口文件区分开,单独打包构建,接着我们采用chunkhash的方式生成哈希值,那么只要我们不改动公共库的代码,就可以保证其哈希值不会受影响。
3、contenthash
在使用chunkhash的例子中,如果index.css被index.js引用了,那么就会共用相同的chunkhash值。但是这样子有个问题,如果index.js更改了代码,css文件就算内容没有任何改变,由于是该模块发生了改变,导致css文件会重复构建。
这个时候,我们可以使用extra-text-webpack-plugin里的contenthash值,保证即使css文件所处的模块里就算其他文件内容改变,只要css文件内容不变,那么不会重复构建。
webpack中的hash、chunkhash、contenthash区别的更多相关文章
- [转]webpack中require和import的区别
webpack中可以写commonjs格式的require同步语法,可以写AMD格式的require回调语法,还有一个require.ensure,以及webpack自己定义的require.incl ...
- 详解webpack中的hash、chunkhash、contenthash区别
hash.chunkhash.contenthash hash一般是结合CDN缓存来使用,通过webpack构建之后,生成对应文件名自动带上对应的MD5值.如果文件内容改变的话,那么对应文件哈希值也会 ...
- webpack中require和import的区别
commonjs同步语法 经典的commonjs同步语法如下: var a = require('./a'); a.show(); 此时webpack会将a.js打包进引用它的文件中.这是最普遍的情形 ...
- Webpack 中 file-loader 和 url-loader 的区别
如果我们希望在页面引入图片(包括img的src和background的url).当我们基于webpack进行开发时,引入图片会遇到一些问题. 其中一个就是引用路径的问题.拿background样式用u ...
- webpack中imports-loader,exports-loader,expose-loader的区别
Webpack有几个和模块化相关的loader,imports-loader,exports-loader,expose-loader,比较容易混淆.今天,我们来理一理. imports-loader ...
- webpack中hash、chunkhash、contenthash区别
webpack中对于输出文件名可以有三种hash值: 1. hash 2. chunkhash 3. contenthash 这三者有什么区别呢? hash 如果都使用hash的话,因为这是工程级别的 ...
- webpack 打包产生的文件名中,hash、chunkhash、contenthash 的区别
table th:first-of-type { width: 90px; } hash 类型 区别 hash 每一次打包都会生成一个唯一的 hash chunkhash 根据每个 chunk 的内容 ...
- Webpack中hash、chunkhash和contenthash三者的区别
在webpack中有三种的方式生成哈希值,分别为hash.chunkhash和contenthash.这三种方式有着不同的用处,或者说在webpack的不同环境中,会使用不同的方式生成哈希值.那为什么 ...
- webpack中hash与chunkhash区别和需要注意的问题
项目发布时,为了解决缓存,需要进行md5签名,这时候就需要用到 hash 和 chunkhash等. 问题一:hash问题 使用 hash 对js和css进行签名时,每一次hash值都不一样,导致无法 ...
随机推荐
- linux内核树的建立(Ubuntu)
博客地址:http://www.cnblogs.com/zengjianrong/p/3178874.html 1.搜索源码 2.下载源码,下载路径可设为:/usr/src/ 3.解压源码 4.进入源 ...
- Ansible15:文件管理模块及Jinja2过滤器
目录 常用文件管理模块 1. file 2. synchronize 3. copy 4. fetch 5. lineinfile 6. stat 7. blockinfile Jinja2模板管理 ...
- [转帖]龙芯3A4000处理器实测:28nm工艺不变 性能仍可提升100%以上
龙芯3A4000处理器实测:28nm工艺不变 性能仍可提升100%以上 http://news.mydrivers.com/1/663/663122.htm 龙芯是中科院下属的计算机所研发的自主产权国 ...
- k8s网络原理
https://blog.csdn.net/watermelonbig/article/details/80646988 k8s中,每个 Pod 都有一个独立的 IP 地址,所有 Pod 在一个网络空 ...
- laravel 一些好用的GitHub项目包
链接地址:好用的GitHub包
- C#工作常用关键字
1.throw //抛出throw new Exception("获取数据失败") //抛出异常 2.Ticks //long类型的数,表示时间,一个以0.1纳秒为单位的时间戳,/ ...
- VUE创建播发器组件并调用
欢迎来到我的友链小屋 首先用vue-cli创建前端项目 参考:https://www.cnblogs.com/ouyangkai/p/11549290.html 新建play.vue文件 编写pl ...
- MVC里模型常用的一些操作
学习也是做买卖,归根到底还是学习成本的问题. 下面把微软集合类型的增删改查稍微罗列一下,大家看看它能带来的便利,和你要学的新东西,还有风险(纯粹的数据操作,不用框架,风险其实不大)相比,是否值得.来决 ...
- 搜索引擎elasticsearch监控利器cat命令
目录 一.Cat通用参数 二.cat命令 三.示例 查询aurajike索引下的总文档数和有效文档数 查询aurajike各分片的调度情况 一.Cat通用参数 参数名 指令示例 功能 Verbose ...
- 来看一下Java中“-”与equeals的区别
简介: == ==是比较两个变量的值,如果是基本数据类型,那么就是比较的基本数据的大小值 情况一 int a=1; int b=1; System.out.println(a==b); 以上图中:== ...