Webpack在所有配置完成或完成之前执行任务。

Question

Webpack有一些很好的钩子，可以在编译开始或完成之前执行任务。但是这些钩子不适用于多配置设置(返回webpack配置对象的数组)。

在这些设置中，您或您正在使用的插件在一种特定配置上注册了所需的钩子，因此钩子将根据此特定配置的生命周期执行。例如，如果完成了注册到的配置，而不是所有配置都完成了，onDone钩子就会被触发。

如何注册在所有webpacktask任务完成之前或之后执行的钩子？

Answer 1

目前，webpack没有直接提供这样的钩子。

有一个挂起的特性请求：https://github.com/webpack/webpack/issues/7613

但就目前而言，使用依赖特性有一个小的解决办法。其想法是创建一个额外的空webpack配置，它是所有其他配置的前身或继承者。所需的钩子将被注册到这个新配置中：

我在用webpack 5。

给定webpack.A.js

export default {
  name: "A",
  dependencies: ["Before"],
  // ...
}

给定webpack.B.js

export default {
  name: "B",
  dependencies: ["Before"],
  // ...
}

为所有配置对象命名是很重要的。

webpack.all.json

import A from "./webpack.A.js"
import B from "./webpack.B.js"

const beforeConfig = {
    name: "Before",
    mode: "development",
    entry: {}, // must be an empty object
    plugins: [...],
}

const afterConfig = {
    name: "After",
    mode: "development",
    entry: {}, // must be an empty object
    plugins: [...],
    dependencies: ["A", "B"]
}

default export [beforeConfig, A, B, afterConfig]

beforeConfig是所有其他配置的前身，这就是为什么它的钩子将在所有配置之前执行。

afterConfig是所有其他配置的继承者，这就是为什么它的oneDone钩子只有在全部完成时才会被执行的原因。

我希望这能帮助其他有同样问题的人。