0
点赞
收藏
分享

微信扫一扫

webpack中hash、chunkHash、contentHash的区别

岛上码农 2022-03-12 阅读 33

webpack中hash、chunkHash、contentHash的区别

hash

Hash:和整个项⽬的构建相关,只要项⽬⽂件有修改,整个项⽬构建的hash值就会更改。这样会导致缓存失效。
在这里插入图片描述在这里插入图片描述
项目中的文件只要有一个文件改变,那么整个项目文件的hash都会改变。

chunkhash

chunkhash:和webpack 打包的chunk 有关,不同的entry 会⽣成不同的chunkhash值

在这里插入图片描述
只有在改变某个chunk的文件时,才会生成对应的hash。比如我改变了index依赖的base.less文件构建结果如下,会发现index对应的hash改变了,而page对应的hash没有改变。

在这里插入图片描述

contenthash

contentHash:根据⽂件内容来定义hash ,⽂件内容不变,则contenthash不变,在项目中,通常做法是把项目中css都抽离出对应的css文件来加以引用。
在这里插入图片描述
在这里插入图片描述
如果修改了base.less文件打包看一下:
css文件和依赖less文件的chunk会发生改变。
在这里插入图片描述

举报

相关推荐

0 条评论