webpack4.0各个击破(8)—— tapable篇
webpack 作为前端最火的构建工具,是前端自动化工具链 最重要的部分 ,使用门槛较高。本系列是笔者自己的学习记录,比较基础,希望通过 问题 + 解决方式 的模式,以前端构建中遇到的具体需求为出发点,学习 webpack 工具中相应的处理办法。(本篇中的参数配置及使用方式均基于 webpack4.0版本 ) 一. tapable概述 tapable 地址: 【tapable-0.2】 tapable 是 webpack 的核心框架(4.0以上版本的API已经发生了变化),是一个基于事件流的框架,或者叫做发布订阅模式,或观察者模式, webpack 的整个生命周期及其开放的自定义插件系统都离不开 tapable 的支持,研究其运行原理是阅读 webpack 源代码的第一步。官方仓库 master 分支的代码是经过ES6重构的,模块化拆分非常细,且加入了很多非核心逻辑,阅读难度较大。建议先从官方仓库中0.2版本的分支开始学习,整个源码只有400行,相对容易理解。 二. tapable-0.2源码解析 2.1 代码结构 //类定义 function Tapable() { this._plugins = {}; } //模块导出 module.exports = Tapable; //定义了许多内部方法和原型方法 ... Tapable 实际上就是一个类定义的模块。 2.2