我尝试按照教程设置Webpack开发服务器，其中使用webpack-dev-server完成，但是由于它不适用于webpack-cli v4，所以我决定使用webpack-serve（版本3.2.0）。我的文件夹结构看起来像this. index.js和test.js是捆绑在一起的，它们应该将一些数字和一个字符串记录到控制台，dist文件夹中的index.html连接到bundle.js。我的package.json是：

{
  "name": "forkify",
  "version": "1.0.0",
  "description": "forkify project",
  "main": "index.js",
  "scripts": {
    "dev": "webpack --mode development",
    "build": "webpack --mode production",
    "start": "webpack-serve --config webpack.config.js --host localhost --port 8080 --open"
  },
  "author": "Alex",
  "license": "ISC",
  "devDependencies": {
    "webpack": "^5.1.0",
    "webpack-cli": "^4.0.0",
    "webpack-serve": "^3.2.0"
  },
  "dependencies": {}
}

和webpack.config.js看起来像这样：

const path = require("path");

module.exports = {
  entry: "./src/js/index.js",
  output: {
    path: path.resolve(__dirname, "dist/js"),
    filename: "bundle.js",
  },
  devServer: {
    contentBase: "./dist",
  },
};

当我运行"start"脚本时，它打开了一个带有“Not found / 404”错误的页面，这里显示，它必须尝试提供索引文件，但找不到索引文件。当在"start"脚本中我没有指定主机和端口时，它打开了http：//[：：]：55555/上的页面，我得到了“Unable to connect error”，我的包中没有任何内容记录到控制台。我认为路径没有问题。在packweb.config.js中将devServer更改为serve会在命令行中产生错误：配置具有未知属性“service”。请帮助我查找问题并使服务器运行。