hava a question using the plugin's plugin

[sfanr]

// xxx/plugin
module.exports = {
  apply(compiler) {
    compiler.hooks.compilation.tap('TwoPlugin', compilation => {
      HtmlWebpackPlugin.getHooks(compilation).beforeEmit.tapAsync(
        'TwoPlugin',
        (object, callback) => {
          object.html = '<div>hello a plugin</div>'; // debugger oh no~~
          callback();
        }
      );
    });
  }
}

// webpack.config.js 
// A and B are the same
const APlugin = require('xxx/plugin');

const BPlugin =  {
  apply(compiler) {
    compiler.hooks.compilation.tap('TwoPlugin', compilation => {
      HtmlWebpackPlugin.getHooks(compilation).beforeEmit.tapAsync(
        'TwoPlugin',
        (object, callback) => {
          object.html = '<div>hello b plugin</div>'; // debugger ok!
          callback();
        }
      );
    });
  }
}

module.exports = {
  mode: 'development',
  entry: {
    app: path.join(__dirname, 'src/index.js')
  },
  output: {
    path: OUTPUT_DIR,
    filename: '[name]_bundle.js'
  },
  plugins: [new HtmlWebpackPlugin(), APlugin, BPlugin]
}

why? please help me. thanks.

[ccfalling]

same question here!

[jantimon]

Please try to uses classes instead