webpack的主要对象

[renaesop]

webpack里面的对象，只要是单例（或者实例数目只跟option挂钩），都可以定义plugin。

compiler

一般而言，webpack的配置文件是一个对象。但是，webpack的配置文件是可以给出数组的，并且可以嵌套。当给出数组的时候，就定义了多个构建任务了。每个webpack的构建任务对应一个compiler实例，互相之间独立，其执行方式是async.map。

自身将处理如下流程:

• 结合用户和默认配置初始化option
• 先加载option中定义的插件，再加载内建插件
• emit过程，负责输出文件

compilation

webpack的编译任务的真正执行者。

自身会处理如下流程：

• addEntry: 调用方法将entry转化为Dependency并转化为module
• seal: 实现 modules ==> chunks ==> assets， 过程中会调度plugin执行优化，包括给出hash

xxModule（不支持插件，但compilation上某些插件会在某些方法中被触发）

webpack会有不同的module，不过他们不是根据文件类型分的，而是根据模块所属依赖类型（是否是dll，multiple，normal等）定的。

webpack把 require(ModulePath)中的ModulePath叫做request 自身会处理如下流程:

• 根据options.module定义的规则和module自身的性质，匹配其loader
• 调用resovler，基于context和request、loader的路径，获取loader和request的绝对路径
• 加载loader, 读取request的内容，称为source，并以waterfall的形式让loader处理
• 如果需要，将loader处理完的source，交给parser（后面有说）处理
• 将dependencies转化为module
• module的id为0，则为entry

parser

解析JS文件，并遍历。

自身会这么做:

• 调用acorn生成ast
• 遍历ast，其中每个语句都会触发插件，例如 parse.applyPluginBailResult('call commonjs:require:xxx', xxx, xx)。就连require函数添加依赖的功能也是插件完成的。

resolver

顾名思义，将路径转化为绝对路径。 有normalResolver、contextResolver、loaderResolver三种。 contextResolver用于解析contextModule（形如require('a/' + b + '/c')这种）

chunk （不支持插件，但compilation上某些插件会在某些方法中被触发）

可以认为chunk是entry和entry依赖的合集，或者是按需加载的module及其依赖。（如果不考虑优化）

chunkHash是根据chunk的id，name以及包含的module内容生成。

xxTemplate

将chunk生成assets的模板。

做法：

• 根据chunk类型选择生成的assets的头部（比如说写入commonjs的runtime）
• 将module当做依赖，结合其id，用函数包裹，添加到到{}中

source

包含源码以及其sourceMap。如果xxModule并没有执行parse阶段的话，只会在emit的时候才会去调用source.source方法获取源码。也就是说，source可以是根据compilation、module的元数据生成的，非常强大的特性。