time: 2020.11.10
author: heyunjiang
plugin 用以处理 loader 不能完成的事,在 webpack 打包的流程中,监听特定钩子实现自定义功能
webpack 要求如下
- plugin 实例对象具有
apply
方法 - apply 方法唯一参数
compiler
对象 - compiler 钩子函数参数提供
compilation
对象和next
方法 - 监听钩子方式:compiler.plugin('emit'),compiler.hooks.emit.tapAsync()
- compilation 对象提供如下属性:assets, chunks, chunk.files, fileTimestamps, modules, module.fileDependencies
function MyExampleWebpackPlugin() {};
MyExampleWebpackPlugin.prototype.apply = function(compiler) {
compiler.hooks.emit.tapAsync('webpacksEventHook', function(compilation, callback) {
callback();
});
};
// webpack.config.js
const MyExampleWebpackPlugin = require('./src/MyExampleWebpackPlugin')
module.exports = {
plugins: [
new MyExampleWebpackPlugin()
]
}
webpack 参与贡献
Compiler 源码 查看各种 Compiler hook
Compilation 源码 查看 Compilation 各种 hook 及提供的资源