webpack 中的hash/chunkHash/contentHash

一、[hash]

    hash是跟整个项目的构建相关,只要项目里有文件更改,整个项目构建的hash值都会更改,并且全部文件都共用相同的hash值;

    缺点是,只有一个文件修改的话,其他文件的缓存就不生效了

二、[chunkHash]

      根据不同的入口文件(Entry)进行依赖文件解析、构建对应的chunk,生成对应的哈希值。我们在生产环境里把一些[公共库][程序入口文件]区分开,单独打包构建,接着我们采用chunkhash的方式生成哈希值,那么只要我们不改动公共库的代码,就可以保证其哈希值不会受影响。主要就是,在生成多个chuank的时候,只有一个chunk 内的代码发生改变时,不会影响其他的chunk的hash。

        缺点:被js引用的css与js共用一个chunkHash值,所以在只有js修改的情况下,css的Hash值也会跟着改变。

三、[contentHash]    

        当使用contenthash时,如果修改js文件,css文件的hash不会变化,但是修改js的文件,css文件的hash也会变化


参考文献:

    https://juejin.im/post/5d70aee4f265da03f12e7ab2

    https://juejin.im/post/5a4502be6fb9a0450d1162ed

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容