웹팩 공식 샵 을 방문하여 의류를 구매하시고 웹팩을 후원해주세요!   모든 후원의 진행사항은 웹팩의 오픈 챌린지 페이지 에서 확인하실 수 있습니다.

ag-grid is proud to partner with webpack

Tapable

Tapable is a small library that allows you to add and apply plugins to a javascript module. It can be inherited or mixed in to other modules. It is similar to NodeJS's EventEmitter class, focusing on custom event emission and manipulation. However, in addition to this, Tapable allows you to have access to the "emittee" or "producer" of the event through callbacks arguments.

Tapable has four groups of member functions:

  • plugin(name:string, handler:function): This allows a custom plugin to register into a Tapable instance's event. This acts similar to the on() method of the EventEmitter, which is used for registering a handler/listener to do something when the signal/event happens.
  • apply(…pluginInstances: (AnyPlugin|function)[]): AnyPlugin should be a class (or, rarely, an object) that has an apply method, or just a function with some registration code inside. This method is just to apply plugins' definition, so that the real event listeners can be registered into the Tapable instance's registry.
  • applyPlugins*(name:string, …): The Tapable instance can apply all the plugins under a particular hash using these functions. This group of methods act like the emit() method of the EventEmitter, controlling event emission meticulously using various strategies.
  • mixin(pt: Object): a simple method to extend Tapable's prototype as a mixin rather than inheritance.

The different applyPlugins* methods cover the following use cases:

  • Plugins can run serially.
  • Plugins can run in parallel.
  • Plugins can run one after the other but taking input from the previous plugin (waterfall).
  • Plugins can run asynchronously.
  • Quit running plugins on bail: that is, once one plugin returns non-undefined, jump out of the run flow and return the return of that plugin. This sounds like once() of EventEmitter but is totally different.

Example

One of webpack's Tapable instances, Compiler, is responsible for compiling the webpack configuration object and returning a Compilation instance. When the Compilation instance runs, it creates the required bundles.

See below for a simplified version of how this looks using Tapable:

node_modules/webpack/lib/Compiler.js

var Tapable = require("tapable");

function Compiler() {
    Tapable.call(this);
}

Compiler.prototype = Object.create(Tapable.prototype);

Now to write a plugin on the compiler,

my-custom-plugin.js

function CustomPlugin() {}
CustomPlugin.prototype.apply = function(compiler) {
  compiler.plugin('emit', pluginFunction);
}

The compiler executes the plugin at the appropriate point in its lifecycle by

node_modules/webpack/lib/Compiler.js

this.apply*("emit",options) // will fetch all plugins under 'emit' name and run them.

Contributors