html-webpack-plugin中定义的钩子在什么时候被call

Question

html-webpack-plugin提供了一面钩子，取自html-webpack-plugin/index.js文件：

// 代码1：
if (compiler.hooks) {
      compiler.hooks.compilation.tap('HtmlWebpackPluginHooks', compilation => {
        const SyncWaterfallHook = require('tapable').SyncWaterfallHook;
        const AsyncSeriesWaterfallHook = require('tapable').AsyncSeriesWaterfallHook;
        compilation.hooks.htmlWebpackPluginAlterChunks = new SyncWaterfallHook(['chunks', 'objectWithPluginRef']);
        compilation.hooks.htmlWebpackPluginBeforeHtmlGeneration = new AsyncSeriesWaterfallHook(['pluginArgs']);
        compilation.hooks.htmlWebpackPluginBeforeHtmlProcessing = new AsyncSeriesWaterfallHook(['pluginArgs']);
        compilation.hooks.htmlWebpackPluginAlterAssetTags = new AsyncSeriesWaterfallHook(['pluginArgs']);
        compilation.hooks.htmlWebpackPluginAfterHtmlProcessing = new AsyncSeriesWaterfallHook(['pluginArgs']);
        compilation.hooks.htmlWebpackPluginAfterEmit = new AsyncSeriesWaterfallHook(['pluginArgs']);
      });
    }

我自定义一个插入其他script标签的钩子，这个钩子的作用是在html-webpack-plugin要插入的script数组中加入一个值：

// 代码2
class HtmlAddDllJsPlugin {
  constructor(opt) {
    this.pathList = opt.pathList;
  }
  apply(compiler) {
    compiler.hooks.tap('compilation', (compilation) => {
      compilation.hooks.htmlWebpackPluginBeforeHtmlProcessing.tap(
      'htmlWebpackPluginBeforeHtmlProcessing',
        (data, cb) => {
            this.pathList.forEach(path => {
              data.assets.js.unshift(path);
            });
      })
    })
  }
}

module.exports = HtmlAddDllJsPlugin;

执行webpack后运行没问题，但是我不清楚代码1中自定的钩子在哪里被callAsync的？### 问题描述

问题出现的平台版本及自己尝试过哪些方法

相关代码

// 请把代码文本粘贴到下方（请勿用图片代替代码）

你期待的结果是什么？实际看到的错误信息又是什么？

Answer 1

并不是你定义了一个钩子，而是你在插件提供的钩子里面注入了一个监听函数。

Answer 2

这篇文章可以解决你的问题
https://juejin.cn/post/684490...