zoukankan      html  css  js  c++  java
  • 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文件内容不变,那么不会重复构建。

  • 相关阅读:
    hive的常用操作
    更改Oracle字符集避免乱码
    SQLLDR导入乱码问题的解决
    linux环境下安装oracle步骤和自启动oracle
    解决Sql Server 日志满了,设置收缩
    解决sql server死锁
    boolean b=true?false:true==true?false:true;
    "无法删除数据库,因为该数据库当前正在使用"问题解决
    C#使用wkhtmltopdf,把HTML生成PDF(包含分页)
    小技巧:方便开机打开多个程序
  • 原文地址:https://www.cnblogs.com/goloving/p/11739612.html
Copyright © 2011-2022 走看看