webpack:理解与应用

依赖图:

webpack 通过依赖图来追踪项目中文件的依赖关系。当文件 A 依赖文件 B 时,webpack 会识别这种依赖关系。即使是图片、字体等资源文件也会被追踪。

模块构建:

webpack 从入口文件开始,通过递归分析依赖图,识别项目中所需的所有模块。然后,webpack 将这些模块打包成少量称为 bundle 的文件,方便浏览器加载。

术语解释:

- 模块:webpack 支持 ES6、CommonJS、AMD 等模块化标准。

- chunk:webpack 在打包过程中操作的模块文件。

- bundle:最终打包后的文件,可能包含多个 chunk。

- Source map:浏览器提供的功能,可通过注释将其添加到打包后的文件中,便于源代码调试。

zip 文件大小:178.87KB