gh-pages 未从 index.html 加载 bundle.js

Question

我已经使用 webpack 设置了一个 React 项目。我想将这个项目上传到我在 Github 上的用户站点。我创建了具有 2 个分支的用户站点存储库 - master 和 gh-pages。项目结构如下：

 dist
    index.html
    bundle.js
 index.html

Package.json 文件包含以下构建和部署命令。

 "start": "webpack-dev-server --open --mode development --content-base ./dist",
 "test": "npm run lint && npm run security-check && npm run bundle",
 "predeploy": "npm run build",
 "deploy": "gh-pages -d dist"

在开发模式下，项目正在运行 fine.The HtmlWebPackPlugin 正在 dist/index.html 中插入 bundle js 脚本标签。为了部署到 gh-pages，当我运行 deploy 命令时，代码在分支 gh-pages 中正确更新。我可以在那里看到最新的 dist 个文件夹文件。

但是用户网站给我 404: not found error bundle.js。

Answer 1

所以在对 gh-pages 进行一些研究之后，我找到了解决方案。对于用户页面，Github 只允许从 master branch.So 发布 index.html 和 bundle.js 应该出现在 master 分支中，它们将作为静态的资源。

这有点令人困惑，因为在其他应用程序中，您可以选择从 master 或 gh-pages 分支构建，或者从 /docs 目录构建。

所以我创建了一个 development 分支，我的源代码就在那里。我修改了部署命令，将代码从 development 分支上传到 master.

"deploy": "gh-pages -d dist -b master"

gh-pages 未从 index.html 加载 bundle.js

gh-pages not loading bundle.js from index.html

github-pages

reactjs

webpack

html-webpack-plugin