webpack项目结构-开始上课吧：Webpack的完美流程有哪些？

也想出现在这里？点击联系我~

立即下单

进入商城

进不了网站？换个网络试试！

如今的网页功能有很多升级和更新。 为了应对各种功能，Webpack的重要性越来越明显。 WebPack 似乎被视为一个模块打包器。 Webpack的运行过程是一个串行过程。 从开始到结束，会依次执行以下流程：

初始化参数：

从配置文件和Shell语句中读取并合并参数，得到最终的参数；

开始编译：

用上一步获得的参数初始化Compiler对象，加载所有配置的插件，并执行该对象的运行模式开始编译；

确定条目：

根据配置中的入口找到所有入口文件；

编译模块：

从入口文件开始，调用所有配置的Loader翻译模块webpack项目结构，然后找出该模块所依赖的模块，然后递归这一步，直到所有入口依赖的文件都被这一步处理完；

完整模块编译：

使用Loader对步骤4中的所有模块进行翻译后，得到每个模块最终翻译的内容以及它们之间的依赖关系；

输出资源：

根据条目和模块之间的依赖关系webpack项目结构，组装包含多个模块的Chunk，然后将每个Chunk转换为单独的文件并将其添加到输出列表中。 这一步是改变输出内容的最后机会；

输出完成：

确定输出内容后，根据配置确定输出路径和文件名，并将文件内容写入文件系统。

在上面的过程中，Webpack会在特定的时间点广播特定的风暴。 插件监听到感兴趣的storm后会执行特定的逻辑，插件可以调用Webpack提供的API来改变Webpack的运行结果。