将内联插件 webpack 4 转换为 webpack 5答案

【问题标题】：Convert inline plugin webpack 4 to webpack 5将内联插件 webpack 4 转换为 webpack 5
【发布时间】：2021-03-09 00:58:02
【问题描述】：

对于我的项目，我使用带有 Karma 的 webpack 4 来运行我的测试。一切正常。我成功迁移到 webpack 5。

但是，我在 GitHub 上找到了一个自定义内联插件，但我不知道如何转换它以使其在 webpack 5 上运行。

webpack.config

// ...
plugins: [
    // ...
    function()
    {
        this.plugin("done", function(stats)
        {
            if (stats.compilation.errors && stats.compilation.errors.length && process.argv.indexOf('--watch') == -1)
            {
                console.log(stats.compilation.errors);
                process.exit(1); // or throw new Error('webpack build failed.');
            }
            // ...
        });
    }
    // ...
],
// ...

确实，我在 webpack 5 上遇到了这个错误：

09 03 2021 01:56:20.991:ERROR [karma-server]：文件加载或预处理期间出错

TypeError: this.plugin 不是函数

【问题讨论】：

标签： webpack webpack-4 webpack-5

【解决方案1】：

我想你可以跟进official document然后它会正常工作。

顺便说一句，您的代码可能会更改为：

{
  // ...
  plugins: [
    new class YourPlugin {
      apply(compiler) {
        compiler.hooks.done.tap('YourPlugin', (
          stats
        ) => {
          if (
            stats.compilation.errors && 
            stats.compilation.errors.length && process.argv.indexOf('--watch') == -1
          ) {
            console.log(stats.compilation.errors);
            process.exit(1); // or throw new Error('webpack build failed.');
          }
        });
      } 
    }
  ]
}

【讨论】：