如何将 React 应用程序部署到个人页面的 Github 个页面

Question

有一些关于如何将 react-app 部署到 GitHub 项目页面的教程，例如 this post（即 www.{github-username}.github.io/{project-name}），使用 npm run deploy.

但是，当我尝试部署我构建的反应应用程序作为我的个人页面时（即 URL 将是 www.{github-username}.github.io/），在尝试成功构建后终端会冻结部署。

我的 package.json 如下所示（根据现有教程的建议）：

{
  "homepage": "http://{github-username}.github.io/",
  "name": "personal-page",
  ...
}

"scripts": {
    ...
    "predeploy": "npm run build",
    "deploy": "gh-pages -d build"
  },

和我运行 npm run deploy 命令。项目构建成功，然后终端在部署前崩溃。当我使用 CTRL+C 终止进程并重新运行命令时，它向我显示此错误：“B运行ch gh-pages 已经存在”。一些已经提到运行这个命令将解决问题：rm -rf node_modules/gh-pages/.cache，但它对我不起作用。

Answer 1

因为我花了两个小时来解决这个问题，而且我不得不从多个来源和解决方案中获取这些信息，所以我决定再花一个小时在这里 post 为其他未来的部署者 (!)同样的问题。

为了提供上下文，对于每个帐户，GitHub 允许在 GitHub 页面上免费托管 1 个个人静态网页和多个静态项目网页。要使用此功能，您必须将个人页面的存储库名称更改为 {github-username}.github.io，并将要部署到 GitHub 页面的任何项目的存储库名称更改为 {github-username}.github.io/{project-name}。

此问题和答案仅与个人页面有关，但也可能为调试项目页面提供一些见解。可以在线找到使用 npm 部署 React 项目的教程（例如，参见 this post）。

为了解决冻结问题，有人建议您将部署命令更改为以下内容：

"scripts": {
    ...
    "predeploy": "npm run build",
    "deploy": "gh-pages -b master -d build"
},

添加 -b master 指定您的项目将部署到的分支。这有助于避免终端冻结，您的代码实际上是通过 www.{github-username}.github.io/ 部署和访问的，但是所有构建文件信息都将提交并推送到主分支。

我想做的是将源项目放在主分支上，并将部署的网站放在不同的构建分支上。而且，我不希望 URL 也包含分支名称。

我尝试将 -b master 更改为 -b {deploy-branch=name}，例如 -b gh-pages，其中 gh-pages 是我要将我的网站部署到的分支的名称。这导致运行ning npm run deploy 再次冻结！！

为了解决这个问题，我不得不手动创建一个远程分支，调用 gh-pages 和运行再次部署命令。

为了确保 GitHub 页面将从 gh-pages 分支加载，我必须转到我的 GitHub 存储库 > 设置 > GitHub 页面并进行更改gh-pages 的分支（见下图）。

在第 2 步之后，我的网站已经启动运行ning 并且可以通过 www.{github-username}.github.io/.

访问

您也可以继续将项目提交推送给分支主管。当然，这样做不会影响您的构建和 GitHub 个人页面。

最后一个问题是在使用 CTRL+C 终止无响应的终端后避免错误“分支 gh-pages 已经存在”。

解决方案是删除缓存，但是从 gh-pages node_module 的 3.1 版开始，他们将缓存移到了不同的路径。所以代替：

rm -rf node_modules/gh-pages/.cache

，我用过：

rm -rf node_modules/.cache/gh-pages

避免错误（感谢Nicholas for his comment）。

我希望这对其他人也有帮助:)

如何将 React 应用程序部署到个人页面的 Github 个页面

How to deploy react app to Github pages for personal page

git

github-pages

reactjs