我的应用程序已正确部署到heroku，但显示为空白

Question

在heroku中部署是正确的，当我打开空白显示的应用程序时，webpack-developer-server可以正确编译我的代码。

这是用于reactjs和节点应用程序

server.js

const path = require('path');
const express = require('express');
const app = express();
const publicPath = path.join(__dirname, '..', 'public');
const port = process.env.PORT || 3000;

app.use(express.static(publicPath));

app.get('*', (req, res) => {
  res.sendFile(path.join(publicPath, 'index.html'));
});

app.listen(port, () => {
  console.log('Server is up!');
});

webpack.config.js

const HtmlWebPackPlugin = require("html-webpack-plugin");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");

module.exports = {
  entry: [
    './src/index.js'
  ],
  output: {
    path: __dirname,
    publicPath: '/',
    filename: 'bundle.js'
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: {
          loader: "babel-loader"
        }
      },
      {
        test: /\.html$/,
        use: [
          {
            loader: "html-loader",
            options: { minimize: true }
          }
        ]
      },
      {
          test: /\.css$/,
          use: [MiniCssExtractPlugin.loader, "css-loader"]
      }
    ]
  },
  plugins: [
    new HtmlWebPackPlugin({
      template: "./public/index.html",
      filename: "./index.html"
    }),
    new MiniCssExtractPlugin({
        filename: "main.css",
      })
  ]
};

package.json

{
  "name": "labo",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "babel-cli": "^6.26.0",
    "babel-core": "^6.26.3",
    "babel-plugin-transform-class-properties": "^6.24.1",
    "babel-plugin-transform-object-rest-spread": "^6.26.0",
    "babel-preset-env": "^1.7.0",
    "babel-preset-react": "^6.24.1",
    "polished": "^2.3.3",
    "react-modal": "^3.8.1",
    "react-scripts": "2.1.3",
    "styled-components-theme": "^1.0.5",
    "styled-react-modal": "^1.2.1",
    "webpack": "^4.29.0",
    "webpack-cli": "^3.2.1",
    "@babel/core": "^7.2.2",
    "@babel/preset-env": "^7.3.1",
    "@babel/preset-react": "^7.0.0",
    "babel-loader": "^8.0.5",
    "babel-plugin-styled-components": "^1.10.0",
    "css-loader": "^2.1.0",
    "html-loader": "^0.5.5",
    "html-webpack-plugin": "^3.2.0",
    "mini-css-extract-plugin": "^0.5.0",
    "react": "^16.7.0",
    "react-dom": "^16.7.0",
    "styled-components": "^4.1.3",
    "terser": "^3.14.1"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "serve": "live-server public/",
    "build:dev": "webpack",
    "build:prod": "webpack -p",
    "dev-server": "webpack-dev-server",
    "heroku-postbuild": "webpack -p",
    "start": "node server/server.js"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ],
  "devDependencies": {
    "webpack-dev-server": "^3.1.14"
  }
}

我希望我的应用程序可以在heroku中运行，但是没有显示任何代码，并且页面为空白。我认为问题出在webpack的配置中。 我正在尝试对Webpack Server进行此配置，我试图找出这是否是为什么在Heroku中未显示代码的问题。