shfshanyue / Daily-Question

互联网大厂内推及大厂面经整理,并且每天一道面试题推送。每天五分钟,半年大厂中
https://q.shanyue.tech
4.93k stars 510 forks source link

【Q745】webpack 的打包流程是什么样的 #803

Open shfshanyue opened 12 months ago

Apr2026 commented 7 months ago

Webpack 的打包流程大致可以归纳为以下几个步骤: 初始化: 启动构建,读取与合并配置参数,加载 Plugin,实例化 Compiler。 编译: 从 Entry 出发,针对每个 Module 串行调用对应的 Loader 去翻译文件的内容,再找出该 Module 依赖的 Module,递归地进行编译处理。 确定 Chunk: 每个 Module 都编译完成后,根据 Module 之间的依赖关系,生成代码块(Chunk)。 生成 Bundle: 每个 Chunk 都转换成一个单独的文件加入到输出列表,这步是可以修改输出内容的最后机会。 输出完成: 确定好输出内容后,根据配置确定的路径与文件名,把文件写入到文件系统。