Webpack dev server not working (strange page loaded)

Question

I work with web pack and when I try to run the run script (npm run build:dev) i get this weird page with is actually my workspace folders instead the actual website:

heres my package.json if needed and I used VSCode:

{ "name": "pro-lyrics", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "build": "webpack", "start:dev": "webpack serve", "test": "echo "Error: no test specified" && exit 1" }, "author": "", "license": "ISC", "devDependencies": { "webpack": "^5.12.3", "webpack-cli": "^4.3.1", "webpack-dev-server": "^3.11.1" } }

Answer 1

You need to define where you keep your HTML files in your configuration file for webpack

  devServer: {  
    contentBase: './' // this is default main folder
  }