Webpack无法正确显示bundle.js，并说wepack输出来自未定义的

如何解决Webpack无法正确显示bundle.js，并说wepack输出来自未定义的

我正在建立一个新的编程环境，由于某种原因，由于我假设的更新，这次与上次有所不同。我有我的webpack设置，但看不到我创建的div，在google dev控制台中，它仅显示index.html而不是实际的javascript文件。这是当前的webpack配置：

const path = require("path");
const Dotenv = require('dotenv-webpack');


module.exports = {
  entry: "./src/index.js",mode: "development",devServer: {
    historyApiFallback: true,contentBase: path.resolve(__dirname,"./public"),port: 3000
    },module: {
    rules: [
      {
        test: /\.jsx?$/,exclude: /node_modules/,use: [
          {
            loader: "babel-loader",options: {
              presets: ["@babel/env","@babel/react"],plugins: [
                "@babel/plugin-transform-runtime","@babel/plugin-proposal-class-properties",],},{
        test: /\.(css|sass|scss)$/,use: [
          "style-loader",{
            loader: "css-loader",options: {
              sourceMap: true,importLoaders: 2,{
            loader: "sass-loader",{
        test: /\.svg$/,use: [
          {
            loader: "svg-inline-loader",options: {
              limit: 10000,resolve: {
    extensions: ["*",".js",".jsx"],output: {
    path: path.resolve(__dirname,"dist"),filename: "bundle.js",publicPath: '/'
  },externals: {
    "react-native": true,plugins: [
    new Dotenv()
  ],};

这是我运行yarn start时收到的消息：

 Project is running at http://localhost:3000/
ℹ ｢wds｣: webpack output is served from undefined
ℹ ｢wds｣: Content not from webpack is served from /home/laner107/WeilClientPage/front-end/public
ℹ ｢wds｣: 404s will fallback to /index.html

我在这里到底在做什么错？