为什么 webpack 输出来自 /

如何解决为什么 webpack 输出来自 /

我刚刚学习webpack，一切正常，但是在上次成功启动项目（纯JS）之后，突然一切都失败了。 当我开始项目时，出现此错误： /得到 i“wds”：项目运行在 http://localhost:3000/ i 「wds」：webpack 输出来自 http://localhost:3000/ i 「wds」：不是来自 webpack 的内容从 D:\folderName\folderName\folderName

提供

我不明白为什么会这样。

文件夹结构：

babel.config.json  
node_modules/  
package-lock.json  
src/
---- assets/  
---- components/  
---- core/  
---- favicon.ico  
---- index.html  
---- index.js  
---- scss/
---- dist/             
package.json   
README.md          
webpack.config.js

**package.json**
{
  "name": "excel-corse","version": "1.0.0","description": "","main": "webpack.config.js","scripts": {
    "start": "webpack serve --mode=development","build": "webpack --mode=production"
  },"repository": {
    "type": "git","url": "git+https://github.com/Kunerkhan/Exel-JS.git"
  },"keywords": [],"author": "","private": true,"browserslist": "> 0.25%,not dead","license": "ISC","bugs": {
    "url": "https://github.com/Kunerkhan/Exel-JS/issues"
  },"homepage": "https://github.com/Kunerkhan/Exel-JS#readme","devDependencies": {
    "@babel/core": "^7.13.8","@babel/plugin-proposal-class-properties": "^7.13.0","@babel/preset-env": "^7.13.9","babel-loader": "^8.2.2","copy-webpack-plugin": "^7.0.0","css-loader": "^5.1.1","eslint": "^7.21.0","eslint-config-google": "^0.14.0","eslint-webpack-plugin": "^2.5.2","html-webpack-plugin": "^5.2.0","mini-css-extract-plugin": "^1.3.9","sass": "^1.32.8","sass-loader": "^11.0.1","webpack": "^5.24.2","webpack-cli": "^4.5.0","webpack-dev-server": "^3.11.2"
  },"dependencies": {
    "@babel/eslint-parser": "^7.13.8","clean-webpack-plugin": "^3.0.0","core-js": "^3.9.0","normalize.css": "^8.0.1","regenerator-runtime": "^0.13.7"
  }
}

webpack.config.js

const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const copyPlugin = require('copy-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
const ESLintPlugin = require('eslint-webpack-plugin');

module.exports = (env,argv) => {
  const isProd = argv.mode === 'production';
  const isDev = !isProd;

  const filename = (ext) => isProd ? `[name].[contenthash].bundle.${ext}` : `[name].bundle.${ext}`;

  const plugins = () => {
    const base = [
      new HtmlWebpackPlugin({
        template: './index.html'
      }),new copyPlugin({
        patterns: [
          {
            from: path.resolve(__dirname,'src','favicon.ico'),to: path.resolve(__dirname,'dist')
          }
        ]
      }),new MiniCssExtractPlugin({
        filename: filename('css')
      }),new CleanWebpackPlugin()
    ];

    if (isDev) {
      base.push(new ESLintPlugin());
    }

    return base;
  };

  return {
    target: 'web',context: path.resolve(__dirname,'src'),entry: {
      main: './index.js'
    },output: {
      path: path.resolve(__dirname,'dist'),filename: filename('js')
    },resolve: {
      extensions: ['.js'],alias: {
        '@': path.resolve(__dirname,'@core': path.resolve(__dirname,'core')
      }
    },plugins: plugins(),devServer: {
      contentBase: path.join(__dirname,publicPath: 'http://localhost:3000/',port: 3000,open: true,hot: true,watchContentBase: true
    },devtool: isDev ? 'source-map' : false,module: {
      rules: [
        {
          test: /\.s[ac]ss$/i,use: [
            MiniCssExtractPlugin.loader,'css-loader','sass-loader'
          ]
        },{
          test: /\.m?js$/,exclude: /node_modules/,use: {
            loader: 'babel-loader',options: {
              presets: ['@babel/preset-env'],plugins: ['@babel/plugin-proposal-class-properties']
            }
          }
        }
      ]
    }
  };
};