这一节跑下一批plugin。

compiler.apply(
new EnsureChunkConditionsPlugin(),
new RemoveParentModulesPlugin(),
new RemoveEmptyChunksPlugin(),
new MergeDuplicateChunksPlugin(),
new FlagIncludedChunksPlugin(),
new OccurrenceOrderPlugin(true),
new FlagDependencyExportsPlugin(),
new FlagDependencyUsagePlugin()
);

  希望不要跟上一节一样,全是plugin。

  流程如图(看看流程图就行了,后面也没有什么内容):

EnsureChunkConditionsPlugin

class EnsureChunkConditionsPlugin {
apply(compiler) {
compiler.plugin("compilation", (compilation) => {
const triesMap = new Map();
compilation.plugin(["optimize-chunks-basic", "optimize-extracted-chunks-basic"], (chunks) => { /**/ });
});
}
}

  这个看看就懂,不解释了。

RemoveParentModulesPlugin

class RemoveParentModulesPlugin {
apply(compiler) {
compiler.plugin("compilation", (compilation) => {
compilation.plugin(["optimize-chunks-basic", "optimize-extracted-chunks-basic"], (chunks) => { /**/ });
});
}
}

  难道又是另一批plugin么……

RemoveEmptyChunksPlugin

class RemoveEmptyChunksPlugin {
apply(compiler) {
compiler.plugin("compilation", (compilation) => {
compilation.plugin(["optimize-chunks-basic", "optimize-extracted-chunks-basic"], (chunks) => { /**/ });
});
}
}

  是的。

MergeDuplicateChunksPlugin

class MergeDuplicateChunksPlugin {
apply(compiler) {
compiler.plugin("compilation", (compilation) => {
compilation.plugin("optimize-chunks-basic", (chunks) => { /**/ });
});
}
}

FlagIncludedChunksPlugin

class FlagIncludedChunksPlugin {
apply(compiler) {
compiler.plugin("compilation", (compilation) => {
compilation.plugin("optimize-chunk-ids", (chunks) => { /**/ });
});
}
}

OccurrenceOrderPlugin

class OccurrenceOrderPlugin {
// true
constructor(preferEntry) {
if (preferEntry !== undefined && typeof preferEntry !== "boolean") {
throw new Error("Argument should be a boolean.\nFor more info on this plugin, see https://webpack.js.org/plugins/");
}
this.preferEntry = preferEntry;
}
apply(compiler) {
const preferEntry = this.preferEntry;
compiler.plugin("compilation", (compilation) => {
compilation.plugin("optimize-module-order", (modules) => { /**/ });
compilation.plugin("optimize-chunk-order", (chunks) => { /**/ });
});
}
}

  看到那个错误提示就想笑,这个插件除了你自己谁会去调用啊。

FlagDependencyExportsPlugin

class FlagDependencyExportsPlugin {
apply(compiler) {
compiler.plugin("compilation", (compilation) => {
compilation.plugin("finish-modules", (modules) => { /**/ }); function addToSet(a, b) { /**/ }
});
}
}

FlagDependencyUsagePlugin

class FlagDependencyUsagePlugin {
apply(compiler) {
compiler.plugin("compilation", compilation => {
compilation.plugin("optimize-modules-advanced", modules => { /**/ }); function addToSet(a, b) { /**/ } function isSubset(biggerSet, subset) { /**/ }
});
}
}

  总的来说,这一批plugin是针对模块的,不过仍然没有任何实际行为。

  还剩下3个也一并过了吧。

TemplatedPathPlugin

class TemplatedPathPlugin {
apply(compiler) {
compiler.plugin("compilation", compilation => {
const mainTemplate = compilation.mainTemplate;
mainTemplate.plugin("asset-path", replacePathVariables);
mainTemplate.plugin("global-hash", function(chunk, paths) { /**/ });
mainTemplate.plugin("hash-for-chunk", function(hash, chunk) { /**/ });
});
}
}

RecordIdsPlugin

class RecordIdsPlugin {
apply(compiler) {
compiler.plugin("compilation", compilation => {
compilation.plugin("record-modules", (modules, records) => { /**/ });
compilation.plugin("revive-modules", (modules, records) => { /**/ }); function getDepBlockIdent(chunk, block) { /**/ }
compilation.plugin("record-chunks", (chunks, records) => { /**/ });
compilation.plugin("revive-chunks", (chunks, records) => { /**/ });
});
}
}

WarnCaseSensitiveModulesPlugin

class WarnCaseSensitiveModulesPlugin {
apply(compiler) {
compiler.plugin("compilation", compilation => {
compilation.plugin("seal", () => { /**/ });
});
}
}

  这里把所有compilation事件流触发完后,也只是针对不同的阶段再次进行plugin,所以详细过程还需要继续跑流程。

.25-浅析webpack源码之事件流compilation(3)的更多相关文章

  1. .23-浅析webpack源码之事件流compilation(1)

    正式开始跑编译,依次解析,首先是: compiler.apply( new JsonpTemplatePlugin(options.output), // start new FunctionModu ...

  2. .24-浅析webpack源码之事件流compilation(2)

    下一个compilation来源于以下代码: compiler.apply(new EntryOptionPlugin()); compiler.applyPluginsBailResult(&quo ...

  3. .22-浅析webpack源码之事件流compilation总览

    呃,终于到了这地方-- newCompilation(params) { // ... this.applyPlugins("this-compilation", compilat ...

  4. .21-浅析webpack源码之事件流this-compilation

    上一节生成Compilation实例后,添加了一些属性,随后触发this-compilation事件流,如下: Compiler.prototype.newCompilation = (params) ...

  5. .34-浅析webpack源码之事件流make(3)

    新年好呀~过个年光打游戏,function都写不顺溜了. 上一节的代码到这里了: // NormalModuleFactory的resolver事件流 this.plugin("resolv ...

  6. .27-浅析webpack源码之事件流make(2)

    上一节跑到了NormalModuleFactory模块,调用了原型方法create后,依次触发了before-rsolve.factory.resolver事件流,这节从resolver事件流开始讲. ...

  7. .26-浅析webpack源码之事件流make(1)

    compilation事件流中,依然只是针对细节步骤做事件流注入,代码流程如图: // apply => this-compilation // apply => compilation ...

  8. .37-浅析webpack源码之事件流make(4)

    赶紧完结这个系列咯,webpack4都已经出正式版了. 之前的代码搜索到js文件的对应loader,并添加到了对象中返回,流程如下: this.plugin("factory", ...

  9. 浅析libuv源码-node事件轮询解析(3)

    好像博客有观众,那每一篇都画个图吧! 本节简图如下. 上一篇其实啥也没讲,不过node本身就是这么复杂,走流程就要走全套.就像曾经看webpack源码,读了300行代码最后就为了取package.js ...

随机推荐

  1. bat检测文件大小并邮件报警

    rem 获取当前日期 set TimeName=%date:~0,4%%date:~5,2%%date:~8,2% rem 获取文件名 set file=%TimeName%   rem 获取文件大小 ...

  2. 2.移植uboot-添加2440单板,并实现NOR、NAND启动

    上章分析了uboot启动流程后,接下来便来配置新的单板,实现nor.nand启动 1.首先在uboot里新建单板2440 : cd board/samsung/ cp smdk2410 smdk244 ...

  3. 人工智能一:Al学习路线

    想要跨入AI的大门,如何跨?终于找到了一套学习方法 努力向你靠近 2017-12-03 07:14:51 当下人工智能领域的发展已经有了燎原之势,麦肯锡全球研究院就认为人工智能促进对社会的转变速度将比 ...

  4. asp.net 未能加载文件或程序集“WebApi”或它的某一个依赖项。试图加载格式不正确的程序。

    http://blog.csdn.net/lingxyd_0/article/details/43155039 一般情况下出现这样的问题是因为.dll文件不存在或者路径不正确.但今天我遇到的情况都不在 ...

  5. 在vim中使用zencoding/Emmet

    zencoding在vim上的插件已经改名为Emmet.vim 1. 安装,推荐使用vundle插件管理器安装,在~/.vimrc中,添加:Bundle 'Emmet.vim',输入命令vim +Bu ...

  6. mac pycharm快捷键整理

    转自:http://www.jianshu.com/p/be0bdc02f7da (感谢整理,另外,简书似乎很不错,排版很nice.) Pycharm 快捷键 shift cmd + 展开所有 shi ...

  7. [js插件开发教程]定制一个手风琴插件(accordion)

    本文带来一个垂直方向的手风琴插件开发,可以定制的功能如下: contentClass : 'panel', //面板样式navClass : 'nav', //导航样式activeClass : 'a ...

  8. angular4.0 路由守卫详解

    在企业应用中权限.复杂页多路由数据处理.进入与离开路由数据处理这些是非常常见的需求. 当希望用户离开一个正常编辑页时,要中断并提醒用户是否真的要离开时,如果在Angular中应该怎么做呢? 其实Ang ...

  9. php代码审计一些笔记

    之前学习了seay法师的代码审计与及80sec的高级审计,整理了一些笔记在印象里面,也发到这里作为记录 1,漏洞挖掘与防范(基础篇) sql注入漏洞            挖掘经验:注意点:登录页面, ...

  10. JQueryPagination分页插件,ajax从struts请求数据

    2017-07-16 学完了struts,做了个关于分页的小例子,用到了JQuery分页插件Pagination,先贴下插件下载地址 http://www.jq22.com/jquery-info13 ...