copy-webpack-plugin error: Invalid host defined options

Question

Build fails after using copy-webpack-plugin. The webpack and plugin version have been tested for compatibility (webpack5 cwp10) I am running out of ideas :( Has anyone bumped onto something familiar before? Could this be a cross-module compatibility issue?

error log and configuration code are further provided Thanks in advance

The error is

 HookWebpackError: Invalid host defined options
    at makeWebpackError (/home/egeo/Source/coreon-chrome-plugin/node_modules/webpack/lib/HookWebpackError.js:49:9)
    at /home/egeo/Source/coreon-chrome-plugin/node_modules/webpack/lib/Compilation.js:2495:12
    at eval (eval at create (/home/egeo/Source/coreon-chrome-plugin/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:38:1)
    at /home/egeo/Source/coreon-chrome-plugin/node_modules/webpack/lib/Compilation.js:457:26
    at /home/egeo/Source/coreon-chrome-plugin/node_modules/copy-webpack-plugin/dist/index.js:485:13
    at runMicrotasks (<anonymous>)
    at processTicksAndRejections (internal/process/task_queues.js:97:5)
-- inner error --
TypeError: Invalid host defined options
    at /home/egeo/Source/coreon-chrome-plugin/node_modules/copy-webpack-plugin/dist/index.js:481:13
    at fn (/home/egeo/Source/coreon-chrome-plugin/node_modules/webpack/lib/Compilation.js:456:9)
    at Hook.eval [as callAsync] (eval at create (/home/egeo/Source/coreon-chrome-plugin/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:36:1)
    at Hook.CALL_ASYNC_DELEGATE [as _callAsync] (/home/egeo/Source/coreon-chrome-plugin/node_modules/tapable/lib/Hook.js:18:14)
    at cont (/home/egeo/Source/coreon-chrome-plugin/node_modules/webpack/lib/Compilation.js:2492:34)
    at /home/egeo/Source/coreon-chrome-plugin/node_modules/webpack/lib/Compilation.js:2538:10
    at /home/egeo/Source/coreon-chrome-plugin/node_modules/neo-async/async.js:2830:7
    at Object.each (/home/egeo/Source/coreon-chrome-plugin/node_modules/neo-async/async.js:2850:39)
    at Compilation.createChunkAssets (/home/egeo/Source/coreon-chrome-plugin/node_modules/webpack/lib/Compilation.js:3769:12)
    at /home/egeo/Source/coreon-chrome-plugin/node_modules/webpack/lib/Compilation.js:2533:14
caused by plugins in Compilation.hooks.processAssets
TypeError: Invalid host defined options
    at /home/egeo/Source/coreon-chrome-plugin/node_modules/copy-webpack-plugin/dist/index.js:481:13
    at fn (/home/egeo/Source/coreon-chrome-plugin/node_modules/webpack/lib/Compilation.js:456:9)
    at Hook.eval [as callAsync] (eval at create (/home/egeo/Source/coreon-chrome-plugin/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:36:1)
    at Hook.CALL_ASYNC_DELEGATE [as _callAsync] (/home/egeo/Source/coreon-chrome-plugin/node_modules/tapable/lib/Hook.js:18:14)
    at cont (/home/egeo/Source/coreon-chrome-plugin/node_modules/webpack/lib/Compilation.js:2492:34)
    at /home/egeo/Source/coreon-chrome-plugin/node_modules/webpack/lib/Compilation.js:2538:10
    at /home/egeo/Source/coreon-chrome-plugin/node_modules/neo-async/async.js:2830:7
    at Object.each (/home/egeo/Source/coreon-chrome-plugin/node_modules/neo-async/async.js:2850:39)
    at Compilation.createChunkAssets (/home/egeo/Source/coreon-chrome-plugin/node_modules/webpack/lib/Compilation.js:3769:12)
    at /home/egeo/Source/coreon-chrome-plugin/node_modules/webpack/lib/Compilation.js:2533:14

The configuration used is (webpack.config.js)

const webpack = require('webpack');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const CopyPlugin = require('copy-webpack-plugin');
const path = require('path');

module.exports = (env) => [
  {
    mode: 'production',
    entry: './js/background.js',
    output: {
      path: path.resolve(__dirname, 'dist'),
      publicPath: '/',
      filename: 'background.js',
    },
  },
  {
    mode: 'production',
    entry: {
      './js/login': './js/login.js',
      './js/search': './js/search.js',
      './js/options': './js/options.js',
    },
    output: {
      path: path.resolve(__dirname, 'dist'),
      filename: '[name].js',
      publicPath: '/',
    },
    module: {
      rules: [
        {
          test: /\.(scss|css)$/,
          use: [MiniCssExtractPlugin.loader, "css-loader",
            {
              loader: "sass-loader",
            }
          ]
        },
        {
          test: /\.(png|svg|jpg|jpeg|gif)$/i,
          type: 'asset/resource',
          generator: {
            filename: 'styles/images/[hash][ext][query]'
          }
        },
        {
          test: /\.(woff|woff2|eot|ttf|otf)$/i,
          type: 'asset/resource',
          generator: {
            filename: 'styles/[hash][ext][query]'
          }
        },
      ]
    },
    plugins: [
      new CopyPlugin({
        patterns: [
          {
            from: '/extension-icons/*'
          }
        ],
      }),
      new webpack.DefinePlugin({
        BUILD_FOR: JSON.stringify(env.custom)
      }),
      new MiniCssExtractPlugin({
        filename: ({ chunk }) => `${chunk.name.replace('/js/', '/styles/')}.css`,
      }),
    ],
  }
];

Answer 1

The plugin version 10 started using dynamically imported ES Modules. This has somewhat subpar support in various tools still. E.g. Yarn doesn't seem to handle it well (but npm-based setups can also get broken)

Related bug reports on github:

• https://github.com/webpack-contrib/copy-webpack-plugin/issues/652
• https://github.com/webpack-contrib/copy-webpack-plugin/issues/653
• https://github.com/webpack-contrib/copy-webpack-plugin/issues/643

The official response: the issue is with other tools, not the plugin itself.

Looks like the best way forward is downgrading to v9, as some folks above already mentioned.