webpack 中分不清的名词

1.chunk是什么？

Chunk在Webpack里指一个代码块，那具体是指什么样的代码块呢？👇
Chunk是Webpack打包过程中，一堆module的集合。Webpack通过引用关系逐个打包模块，这些module就形成了一个Chunk。
产生Chunk的三种途径

entry入口
异步加载模块
代码分割（code spliting）

Chunk只是一个概念，理解了Chunk概念，更有利于对webpack有一定的认识。

注：chunk bundle的区别
一般来说，chunk文件和bundle文件都是一一对应的，除了上面三种chunk文件之外，再从js文件中单独提取出来的文件，比如css文件，那么该css文件和js文件就来自于同一个chunk代码块，但是确是两个不同的bundle文件。

所以，chunk文件是webpack打包过程中形成的代码块，而bundle确是最后加载和编译之后形成的代码块，直接可以在浏览器中运行。

2.hash chunkHash contentHash 区别

哈希一般是与CDN缓存一起使用的，当一个文件发生变化时，它对应文件的哈希值也会发生变化，HTML引用的js文件的哈希值也会发生变化，触发CDN服务器从源服务器上拉取相应的数据，更新本地缓存。

• hash
  hash主要用在开发环境当中，它与整个项目的hash都是一样的，当一个文件发生变化时，整个项目的hash值都会发生变化，这样浏览器就不会缓存文件，提高开发效率。

• chunkHash
  当我们使用hash的时候，有一个文件发生变化时，每次hash值都会发生变化，这样没有办法实现CDN缓存和浏览器缓存的。所以我们才用chunkHash，chunkHash是根据webpack打包生成的chunk来生成的，同一个chunk的chunkHash是一样的。
  这样的话，在生产环境中，我们修改utils文件时，只有chunk1的hash发生变化，chunk0没有变化，这样就可以运用浏览器缓存和CDN缓存了。
  但是，我们可以发现，当修改css文件之后，同一个chunk0中的js文件也会一起更新，这样对资源来说是一种浪费。
  这就要用到contentHash.
  
• contentHash
  contentHash是与内容关联在一起的缓存，只要某一个文件发生变化，它的contentHash就会发生变化。