webpack 中几种hash区别

webpack 打包生成文件的时候，为了防止缓存，会在文件后边跟上版本号或者hash值，采用版本号的时候，一些小的修改，必须更改版本号，否则就会形成缓存。这样并不符合个人业务需求，因此咱们将文件后边跟上hash值，webpack的hash分为三种（hash ，chunkhash，contenthash），采用合理的hash能够提供用户的访问速度

hash

hash是跟整个项目的构建相关，只要项目里有文件更改，整个项目构建的hash值都会更改，而且所有文件都共用相同的hash值

chunkhash

chunkhash，它根据不一样的入口文件(Entry)进行依赖文件解析、构建对应的chunk，生成对应的哈希值。咱们在生产环境里把一些公共库和程序入口文件区分开，单独打包构建，接着咱们采用chunkhash的方式生成哈希值，那么只要咱们不改动公共库的代码，就能够保证其哈希值不会受影响。

contenthash

在chunkhash的例子，咱们能够看到因为index.css被index.js引用了，因此共用相同的chunkhash值。可是这样子有个问题，若是index.js更改了代码，css文件就算内容没有任何改变，因为是该模块发生了改变，致使css文件会重复构建。
这个时候，咱们能够使用extra-text-webpack-plugin里的contenthash值，保证即便css文件所处的模块里就算其余文件内容改变，只要css文件内容不变，那么不会重复构建。

// extract css into its own file
    new ExtractTextPlugin(utils.assetsPath('css/[name].[contenthash].css')),