如何将 React 应用程序的提交代码部署到 Github Pages

Question

我对github不是很好。 我有两个疑问。 我使用 cra 创建了一个反应应用程序，并按照我在谷歌中可以找到的部署步骤进行操作。

现在我有两个分支 main 和 gh-pages。

1. 所以我想确认一下，main 将包含我的源代码，而 gh-pages 将包含构建代码。

2. 我提交的代码将转到 main，然后我需要运行 npm run deploy。 它会更新gh-pages吗？

Answer 1

将构建文件直接提交到 git repo 不是一个好习惯，但让我们先看看这怎么可能。

您的 git 存储库中有两个分支：main 和 gh-pages。 两个分支是分开的，因此您提交到主分支的代码不会更新 gh-pages 分支。 要更新 gh-pages 分支，您需要切换到 gh-pages 分支以提交您的构建。 但是当你切换到 gh-pages 分支时，它不会包含你在主分支上提交的更改，因为它是从以前的提交中分支出来的，你必须先变基。

所以你的 git 工作流程是：

1. 将你的代码提交到主分支
2. 将 gh-pages 分支重新绑定到主分支
3. 切换到 gh-pages 分支
4. 构建您的应用程序，将您的构建提交到 gh-pages 分支
5. 强制推送你的 gh-pages 分支
6. 切换回主分支以备将来提交

您应该考虑使用Deploy to GitHub Pages GitHub Actions，而不是执行上述繁琐的 git 操作。 构建和部署工作将由云上的 CI/CD 系统完成，因此您不必在本地构建和提交文件。