Javascript 如何获取gh页面以查找bundle.js

我正在尝试将webpack React应用程序部署到我的gh页面

下面是我用来构建和部署的脚本

  "scripts": {
    "start": "webpack-dev-server --open --mode development",
    "build": "webpack --mode production",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "watch": "webpack-dev-server --progress",
    "deploy": "gh-pages -d dist"
  },

运行后：

npm run build
npm run deploy

My/dist/文件夹已部署到gh pages分支。

导航到该页时，该页为空

控制台显示以下错误：

Failed to load resource: the server responded with a status of 404 (Not Found) bundle.js:1

这是我的网页配置：

const path = require("path");

module.exports = {
    entry: path.resolve(__dirname, "./src/index.js"),
    output: {
      filename:"bundle.js",
      path: path.resolve(__dirname, '/dist')
    },
    module: {
        rules: [
          {
            test: /\.(js|jsx)$/,
            exclude: /node_modules/,
            use: {
              loader: "babel-loader"
            }
          },
          {
            test: /\.s[ac]ss$/i,
            use: [
              // Creates `style` nodes from JS strings
              'style-loader',
              // Translates CSS into CommonJS
              'css-loader',
              // Compiles Sass to CSS
              'sass-loader',
            ],
          },
          {
            test: /\.css$/,
            loaders: ["style-loader", "css-loader"]
          }
        ]
    },
    devServer: {
      contentBase: path.join(__dirname, "/dist"),
      historyApiFallback:true

    }


};

---

我相信当您运行build和deploy时，它会认为您的主页位于

/

上。但事实上，你的主页是

https://damhan.github.io/Serify/

在package.json中，添加以下内容：

{
  "name": "serify",
  "version": "0.1.0",
  "private": true,
  "homepage": "https://damhan.github.io/Serify/",
  ...
}

我还查看了您在公用文件夹中的

index.html

，您手动添加了

。在本例中，我将添加