如何将提交的 react 应用代码部署到 Github Pages

Question

我不太擅长 github。我有两个疑问。我使用 cra 创建了一个 react 应用程序，并按照我可以在 google 中找到的部署步骤进行操作。

现在我有两个分支 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. rebase gh-pages 分支到 main
3. 切换到 gh-pages 分支
4. 构建您的应用，将您的构建提交到 gh-pages 分支
5. 强制推送你的 gh-pages 分支
6. 切换回主分支以备将来提交

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