How do I configure webpack with WasmPackPlugin

Question

After adding WasmPackPlugin the error appears

const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const WasmPackPlugin = require("@wasm-tool/wasm-pack-plugin");

module.exports = {
  mode: "development",
  entry: "./public/main.js",
  output: {
    path: path.resolve(__dirname, "dist"),
    filename: "index.js",
  },
  plugins: [
    new HtmlWebpackPlugin({
      template: "./public/index.html",
    }),
    new WasmPackPlugin({
      crateDirectory: path.resolve(__dirname, "."),
      outDir: path.resolve(__dirname, "pkg"),
      wasmPackPath: "/node_modules/wasm-pack",
    }),
  ],
};

this is the error

[webpack-dev-middleware] Error: spawn npm ENOENT
 at Process.ChildProcess._handle.onexit (node:internal/child_process:283:19)
     at onErrorNT (node:internal/child_process:478:16)
     at processTicksAndRejections (node:internal/process/task_queues:83:21) {
   errno: -4058,
   code: 'ENOENT',
   syscall: 'spawn npm',
   path: 'npm',
   spawnargs: [ 'install', '-g', 'wasm-pack' ]
 }

I have all the required packages installed, Irun with serve script

webpack serve --mode=development