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')),