node.jswebpackwebpack.config.js

HookWebpackError: Not supported when copy-webpack-plugin is used on Windows


I'm running into an error on Windows 10 whenever I try to run webpack, it works fine on macOS. This is the error

[webpack-cli] HookWebpackError: Not supported

It runs fine without "CopyPlugin", but I would like to copy img folder into dist folder. Have you experienced similar issues and how did you fix them?

const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const CssMinimizerPlugin = require("css-minimizer-webpack-plugin");
const TerserPlugin = require("terser-webpack-plugin");
const CopyPlugin = require('copy-webpack-plugin');
const path = require("path");
module.exports = {
  entry: ['./src/assets/scss/app.scss', './src/assets/js/app.js'],
  output: {
    path: path.resolve(__dirname, 'dist'),
    publicPath: '/dist',
    filename: 'assets/js/app.js',
  },
  module: {
    rules: [
      {
        test: /.s?css$/,
        exclude: /node_modules/,
        use: [
          {
            loader: MiniCssExtractPlugin.loader
          },
          {
            loader: "css-loader",
            options: {
              importLoaders: 2
            }
          },
          {
            loader: 'sass-loader'
          }
        ]
      }
    ],
  },
  resolve: {
    extensions: [".js", ".jsx"]
  },
  optimization: {
    minimize: true,
    minimizer: [
      new TerserPlugin(),
      `...`,
      new CssMinimizerPlugin(),
    ],
  },
  plugins: [
    new MiniCssExtractPlugin({
      filename: './assets/css/app.css'
    }),
    new CopyPlugin({
      patterns: [
        { from: "./src/assets/img", to: "assets/img" }
      ],
    }),
  ],
  devServer: {
    open: true,
    port: 3000,
    hot: true,
    static: {
      directory: path.join(__dirname, './'),
    }
  },
};

From package.json

"devDependencies": {
    "ajv": "^7.2.4",
    "babel-preset-env": "^1.7.0",
    "babel-register": "^6.26.0",
    "clean-css": "^5.2.2",
    "copy-webpack-plugin": "^10.0.0",
    "css-loader": "^6.5.1",
    "css-minimizer-webpack-plugin": "^3.2.0",
    "mini-css-extract-plugin": "^2.4.5",
    "sass": "^1.44.0",
    "sass-loader": "^12.3.0",
    "terser-webpack-plugin": "^5.2.5",
    "webpack": "^5.64.4",
    "webpack-cli": "^4.9.1",
    "webpack-dev-server": "^4.6.0"
  }

Solution

  • Your node version is lower than 12.20,Please select one of the schemes

    1.Upgrade your node

    npm install node@12.20.0 -g

    Or the latest
    npm install node@latest -g

    Under Windows npm install node may note work, and you should install the latest from https://nodejs.org/en/download/ using Windows Installer (.msi)

    2.Reduce the version of copy-webpack-plugin

    npm install copy-webpack-plugin@9 -D