Webpack的工作方式

87 阅读2分钟

Webpack的工作方式是:把你的项目当做一个整体,通过一个给定的主文件(如:index.js),Webpack将从这个文件开始找到你的项目的所有依赖文件,使用loaders处理它们,最后打包为一个(或多个)浏览器可识别的JavaScript文件

webpack的工作流程是把项目作为一个整体,通过一个给定的主文件index.js,webpack将从这个文件开始找到你的项目的所有依赖文件,使用loader处理它们,最后打包为一个或者多个浏览器可以识别的javascript文件 具体流程为 首先是读取webpack的配置参数,然后启动webpack,穿件complier对象并开始解析项目,从入口文件entry开始解析,并且找到其导入的依赖模块,递归遍历分析,形成依赖关系树,其次对不同类型的依赖模块文件使用对应的loader进行编译,最终转为js文件。 整个过程中webpack会通过发布订阅模式,向外抛出一些hooks,而webpack的插件即可以通过监听这些关键的事件节点,执行插件任务进而达到干预输出结果的目的

1、读取webpack的配置参数;
2、启动webpack,创建Compiler对象并开始解析项目;
3、从入口文件(entry)开始解析,并且找到其导入的依赖模块,递归遍历分析,形成依赖关系树;
4、对不同文件类型的依赖模块文件使用对应的Loader进行编译,最终转为Javascript文件;
5、整个过程中webpack会通过发布订阅模式,向外抛出一些hooks,而webpack的插件即可通过监听这些关键的事件节点,执行插件任务进而达到干预输出结果的目的。