Problems at 'Hello World' step npm issues, willing to work through!

[FreekyFrank]

Running npm install produces:
41 vulnerabilities (1 low, 6 moderate, 29 high, 5 critical)
Running npm audit fix produces:
8 vulnerabilities (1 low, 7 high)
Now am faced with a situation which will produce breaking changes!!
As a developer who is an npm and wasm novice this looks like a potentially big climb when I am not even sure the previous steps are correct.
I am willing and able to work through this or step back and start again but I think I need some help. Judging by other issues raised so do others!
$ npm ls
create-wasm-app@0.1.0 ~/code/wasm-rust/rust-and-webassembly-book/wasm-game-of-life/www
├── copy-webpack-plugin@5.1.2
├── hello-wasm-pack@0.1.0
├── webpack-cli@3.3.12
├── webpack-dev-server@3.11.3
└── webpack@4.43.0
$ npm ls -g
~/.nvm/versions/node/v20.11.1/lib
├── browserify@17.0.0
├── corepack@0.23.0
└── npm@10.5.0

[abdounasser202]

I had the same issue and I found answers here #295

1. Your devDependencies should be as follows

"devDependencies": {
    "@webpack-cli/serve": "^2.0.5",
    "copy-webpack-plugin": "^11.0.0",
    "hello-wasm-pack": "^0.1.0",
    "webpack": "^5.88.0",
    "webpack-cli": "^5.1.4",
    "webpack-dev-server": "^4.15.1"
  }

2. then you need to replace plugins as follows in webpack.config.js

plugins: [new CopyWebpackPlugin({ patterns: ["index.html"] })],

And also this add this experiments: { asyncWebAssembly: true },

More other infos are here : rustwasm/create-wasm-app#206

[ptdecker]

I had the same problem and @abdounasser202 's input addressed it

[witcheslive]

Think I'm giving up on using rust+wasm and will look for something else, as besides it being near a year of the setup being horribly outdated in this guide and having to even find this info to get anywhere, I can't even get it to go past this part. I've redone this multiple times, triple checked my work, it still keeps doing this even once I get past the dependency hell of this using depreciated and removed features:

anna@coblyn ~/awoken-fantasy/wasm-game-of-life/www $ npm run start

> create-wasm-app@0.1.0 start
> webpack-dev-server

<i> [webpack-dev-server] Project is running at:
<i> [webpack-dev-server] Loopback: http://localhost:8080/
<i> [webpack-dev-server] On Your Network (IPv4): http://192.168.122.65:8080/
<i> [webpack-dev-server] Content not from webpack is served from '/home/anna/awoken-fantasy/wasm-game-of-life/www/public' directory
assets by path *.js 275 KiB
  asset bootstrap.js 268 KiB [emitted] (name: main)
  asset index_js.bootstrap.js 6.85 KiB [emitted]
asset b0dc0ef40f24c755ae73.module.wasm 1.51 KiB [emitted] [immutable]
asset index.html 297 bytes [emitted] [from: index.html] [copied]
runtime modules 31.6 KiB 15 modules
modules by path ./node_modules/ 175 KiB
  modules by path ./node_modules/webpack-dev-server/client/ 71.8 KiB 16 modules
  modules by path ./node_modules/webpack/hot/*.js 5.17 KiB 4 modules
  modules by path ./node_modules/html-entities/lib/*.js 78.9 KiB 4 modules
  ./node_modules/ansi-html-community/index.js 4.16 KiB [built] [code generated]
  ./node_modules/events/events.js 14.5 KiB [built] [code generated]
modules by path ../pkg/ 1.39 KiB (javascript) 1.29 KiB (webassembly)
  ../pkg/wasm_game_of_life.js 203 bytes [built] [code generated]
  ../pkg/wasm_game_of_life_bg.wasm 40 bytes (javascript) 1.29 KiB (webassembly) [built] [code generated] [1 error]
  ../pkg/wasm_game_of_life_bg.js 1.15 KiB [built] [code generated]
modules by path ./*.js 337 bytes
  ./bootstrap.js 279 bytes [built] [code generated]
  ./index.js 58 bytes [built] [code generated]

ERROR in ../pkg/wasm_game_of_life_bg.wasm
Module parse failed: Unknown element type in table: 0xNaN
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
Error: Unknown element type in table: 0xNaN
    at parseTableType (/home/anna/awoken-fantasy/wasm-game-of-life/www/node_modules/@webassemblyjs/wasm-parser/lib/decoder.js:1018:13)
    at parseTableSection (/home/anna/awoken-fantasy/wasm-game-of-life/www/node_modules/@webassemblyjs/wasm-parser/lib/decoder.js:1274:24)
    at parseSection (/home/anna/awoken-fantasy/wasm-game-of-life/www/node_modules/@webassemblyjs/wasm-parser/lib/decoder.js:1406:24)
    at Object.decode (/home/anna/awoken-fantasy/wasm-game-of-life/www/node_modules/@webassemblyjs/wasm-parser/lib/decoder.js:1740:25)
    at decode (/home/anna/awoken-fantasy/wasm-game-of-life/www/node_modules/@webassemblyjs/wasm-parser/lib/index.js:253:21)
    at WebAssemblyParser.parse (/home/anna/awoken-fantasy/wasm-game-of-life/www/node_modules/webpack/lib/wasm-async/AsyncWebAssemblyParser.js:61:19)
    at /home/anna/awoken-fantasy/wasm-game-of-life/www/node_modules/webpack/lib/NormalModule.js:1303:19
    at processResult (/home/anna/awoken-fantasy/wasm-game-of-life/www/node_modules/webpack/lib/NormalModule.js:937:11)
    at /home/anna/awoken-fantasy/wasm-game-of-life/www/node_modules/webpack/lib/NormalModule.js:1030:5
    at /home/anna/awoken-fantasy/wasm-game-of-life/www/node_modules/loader-runner/lib/LoaderRunner.js:407:3
 @ ../pkg/wasm_game_of_life.js 1:0-52 4:15-19 5:0-21
 @ ./index.js 1:0-42 3:0-10
 @ ./bootstrap.js 4:0-20

webpack 5.95.0 compiled with 1 error in 167 ms

[spookyvision]

These days using trunk results in a much better experience than npm.