webpack的module、bundle、chunk分别指的是什么?
Module
官方概念:Module 是离散功能块,相比于完整程序提供了更小的接触面。精心编写的模块提供了可靠的抽象和封装界限,使得应用程序中每个模块都具有条理清楚的设计和明确的目的。
module其实就是一个文件或者文件内通过import等方式引用代码块或第三方等均可认为是一个module,也就是说任何一个可以被导入导出的文件都是一个模块。
Chunk
官方概念:Chunk 此 webpack 特定术语在内部用于管理捆绑过程。输出束(bundle)由块组成,其中有几种类型(例如 entry 和 child )。通常,块 直接与 输出束 (bundle)相对应,但是,有些配置不会产生一对一的关系。
当我们写的 module 源文件传到 webpack 进行打包时,webpack 会根据文件引用关系生成 chunk 文件,webpack 会对这个 chunk 文件进行一些操作。
bundle
官方概念:bundle 由许多不同的模块生成,包含已经经过加载和编译过程的源文件的最终版本。
webpack 处理好 chunk 文件后,最后会输出 bundle 文件,这个 bundle 文件包含了经过加载和编译的最终源文件,所以它可以直接在浏览器中运行。通常我们会弄混这两个概念,以为Chunk就是Bundle,Bundle就是我们最终输出的一个或多个打包文件。大多数情况下,一个Chunk会生产一个Bundle。