Error while running frontend: Unable to load '@webpack-cli/serve'

[Spnetic-5]

I have gone through the official docs and videos and successfully set up the environment for the scala-webapp-template. The backend is running fine, but I am facing an issue with launching the web and admin front-end (UI) due to some webpack errors.

[error] [webpack-cli] Unable to load '@webpack-cli/serve' command
[error] [webpack-cli] TypeError: options.forEach is not a function

I have tried all possible solutions mentioned on the internet, including changing the webpack, webpack-cli, and webpack-dev-server versions to compatible ones. I have also made sure that my Node version is up to date. (v16.7.0)

Any help or suggestion would be appreciated. Thanks in advance!

[AlexITC]

Please review section 4 from the docs, the example shows:

# verify your version
$ node --version
v16.7.0

Is node --version displaying the same?

[Spnetic-5]

node --version

Yeah it's the same

[AlexITC]

Please post the full log, also, on the project directory, print these values:

java -version
node --version
npm -version
yarn -version

[Spnetic-5]

java -version

openjdk version "11.0.16" 2022-07-19
OpenJDK Runtime Environment Temurin-11.0.16+8 (build 11.0.16+8)
OpenJDK 64-Bit Server VM Temurin-11.0.16+8 (build 11.0.16+8, mixed mode)

node --version

v16.7.0

npm -version

7.20.3

yarn -version

1.22.19

[AlexITC]

Your versions match the suggested ones, what OS are you using? can you post the full log?

[Spnetic-5]

I'm using Pop!_OS 22.04 LTS (Ubuntu based).

csgo@sau-pop-os:~/Desktop/GSoC/scala-webapp-template$ sbt dev-web
[info] welcome to sbt 1.7.3 (Eclipse Adoptium Java 11.0.16)
[info] loading settings for project scala-webapp-template-build from plugins.sbt ...
[info] loading project definition from /home/csgo/Desktop/GSoC/scala-webapp-template/project
[info] loading settings for project root from build.sbt ...
[info] BuildInfo settings:
[info] BuildInfo settings:
[info] (apiUrl,None)
[info] (apiUrl,None)
[info] set current project to root (in build file:/home/csgo/Desktop/GSoC/scala-webapp-template/)
[warn] there are 10 keys that are not used by any other settings/tasks:
[warn]  
[warn] * admin / Compile / fastOptJS / webpackExtraArgs
[warn]   +- /home/csgo/Desktop/GSoC/scala-webapp-template/build.sbt:199
[warn] * admin / Compile / fullOptJS / webpackExtraArgs
[warn]   +- /home/csgo/Desktop/GSoC/scala-webapp-template/build.sbt:200
[warn] * admin / webpackDevServerPort
[warn]   +- /home/csgo/Desktop/GSoC/scala-webapp-template/build.sbt:445
[warn] * apiJS / Compile / stMinimize
[warn]   +- /home/csgo/Desktop/GSoC/scala-webapp-template/build.sbt:276
[warn] * commonJS / Compile / stMinimize
[warn]   +- /home/csgo/Desktop/GSoC/scala-webapp-template/build.sbt:250
[warn] * ui / Compile / stMinimize
[warn]   +- /home/csgo/Desktop/GSoC/scala-webapp-template/build.sbt:312
[warn] * web / Compile / fastOptJS / webpackExtraArgs
[warn]   +- /home/csgo/Desktop/GSoC/scala-webapp-template/build.sbt:199
[warn] * web / Compile / fullOptJS / webpackExtraArgs
[warn]   +- /home/csgo/Desktop/GSoC/scala-webapp-template/build.sbt:200
[warn] * web / Compile / stMinimize
[warn]   +- /home/csgo/Desktop/GSoC/scala-webapp-template/build.sbt:392
[warn] * web / webpackDevServerPort
[warn]   +- /home/csgo/Desktop/GSoC/scala-webapp-template/build.sbt:388
[warn]  
[warn] note: a setting might still be used by a command; to exclude a key from this `lintUnused` check
[warn] either append it to `Global / excludeLintKeys` or call .withRank(KeyRanks.Invisible) on the key
[warn] sbt 0.13 shell syntax is deprecated; use slash syntax instead: web / Compile / fastOptJS / startWebpackDevServer
[info] Starting webpack-dev-server
[error] [webpack-cli] Unable to load '@webpack-cli/serve' command
[error] [webpack-cli] TypeError: options.forEach is not a function
[error]     at WebpackCLI.makeCommand (/home/csgo/Desktop/GSoC/scala-webapp-template/web/target/scala-2.13/scalajs-bundler/main/node_modules/webpack-cli/lib/webpack-cli.js:108:21)
[error]     at ServeCommand.apply (/home/csgo/Desktop/GSoC/scala-webapp-template/web/target/scala-2.13/scalajs-bundler/main/node_modules/@webpack-cli/serve/lib/index.js:41:19)
[error]     at loadCommandByName (/home/csgo/Desktop/GSoC/scala-webapp-template/web/target/scala-2.13/scalajs-bundler/main/node_modules/webpack-cli/lib/webpack-cli.js:626:35)
[error]     at Command.<anonymous> (/home/csgo/Desktop/GSoC/scala-webapp-template/web/target/scala-2.13/scalajs-bundler/main/node_modules/webpack-cli/lib/webpack-cli.js:1091:23)
[error]     at Command.listener [as _actionHandler] (/home/csgo/Desktop/GSoC/scala-webapp-template/web/target/scala-2.13/scalajs-bundler/main/node_modules/commander/index.js:922:31)
[error]     at Command._parseCommand (/home/csgo/Desktop/GSoC/scala-webapp-template/web/target/scala-2.13/scalajs-bundler/main/node_modules/commander/index.js:1503:14)
[error]     at Command.parse (/home/csgo/Desktop/GSoC/scala-webapp-template/web/target/scala-2.13/scalajs-bundler/main/node_modules/commander/index.js:1292:10)
[error]     at Command.parseAsync (/home/csgo/Desktop/GSoC/scala-webapp-template/web/target/scala-2.13/scalajs-bundler/main/node_modules/commander/index.js:1318:10)
[error]     at WebpackCLI.run (/home/csgo/Desktop/GSoC/scala-webapp-template/web/target/scala-2.13/scalajs-bundler/main/node_modules/webpack-cli/lib/webpack-cli.js:1123:28)
[error]     at runCLI (/home/csgo/Desktop/GSoC/scala-webapp-template/web/target/scala-2.13/scalajs-bundler/main/node_modules/webpack-cli/lib/bootstrap.js:11:19)
[success] Total time: 9 s, completed Mar 6, 2023, 9:16:12 PM
[info] sbt server started at local:///home/csgo/.sbt/1.0/server/ab6cd90c346c8cab4691/sock
[info] started sbt server
[success] Total time: 1 s, completed Mar 6, 2023, 9:16:13 PM
[info] 1. Monitoring source files for root/web/fastOptJS...
[info]    Press <enter> to interrupt or '?' for more options.
[info] Received input event: CancelWatch.
[info] shutting down sbt server

[AlexITC]

I was able to reproduce the problem, seems like one of our dependency upgrades broke the dev-web command, thanks for your patience.

[AlexITC]

I have reverted the dependency back and everything is working again, please check on your side.

Thanks!

[Spnetic-5]

Thanks @AlexITC , everything is working for me as well. I will reach out to you via email for further guidance.