如何发布到Github Pages？

Question

我在理解如何发布到Github Pages时遇到了麻烦。有一种新的方法可以发布使用Angular Cli创建的Angular项目；我正在按照此页面上的指示进行操作，使用新命令angular-cli-ghpages：

Execute angular-cli-ghpages in order to deploy the project with a build from dist folder.
Note: you have to create the dist folder in before (e.g. ng build --prod)

Usage:

ng build --prod --base-href "https://USERNAME.github.io/REPOSITORY/"
angular-cli-ghpages [OPTIONS]

我为我的项目创建了一个dist文件夹，然后运行了ng build代码。终端显示所有块都已渲染，但我找不到连接到github页面的链接。我在github上查看我的存储库，似乎什么也没发生。这是因为我需要进入特定文件夹执行angular-cli-ghpages吗？这是我的存储库，非常感谢任何帮助。

- I Like

Answer 1

我成功地使用命令将代码推送到Github Pages页面上。

angular-cli-ghpages --repo=https://github.com/parthghiya/testrepo.git --name=parthghiya --email=[e-mail] --no-silent

仓库链接：https://github.com/parthghiya/testrepo

我执行了 ng build --prod --base href .

我所做的步骤：

1. 生成我的SSH并添加它。

https://help.github.com/articles/connecting-to-github-with-ssh/

2. 执行推送命令。

编辑：

要添加多个文件夹

创建与assets平级的文件夹，我创建了两个文件夹Parth和Ghiya。然后在angular-cli.json中添加以下条目

"assets": [
        "assets","parth","ghiya",
        "favicon.ico",
        "manifest.json"
      ],

现在dist文件夹中包含3个文件夹，分别是assets、parth和ghiya。 然后像之前一样执行上述推送命令。

- Parth Ghiya

---

我已经发布到了Github页面，但只有index.html文件显示出来：https://github.com/st4rgut25/biopage 。你是如何使用angular-cli-ghpages命令将文件夹和子文件夹推送到存储库中的？谢谢，我非常感激你迄今为止提供的帮助。 - I Like

谢谢，但我在修改angular-cli.json后仍然无法推送子目录。我尝试将文件“src”添加到资产中。请查看我的编辑以获取详细信息。 - I Like

@st4rgut：但那些是你的开发文件夹。唯一会被推送的是dist文件夹中的内容。GitHub页面除了dist文件夹中的内容外，不需要任何其他东西。 - Parth Ghiya

检查开发者工具以查找错误..！你执行了 ng build --base-href . 吗？ - Parth Ghiya

我正在尝试添加“assets”文件夹，但是图像不会显示，因为在img url中的“assets”前面有一个点，例如https://st4rgut25.github.io/biopage9/.assets/images/coop.gif。您知道如何去掉它吗？感谢您，我的代码中没有这个句点。 - I Like

Answer 2

通过Angular CLI部署到GitHub的选项已被移除。请参阅此更改。

- snorkpete

---

我相信你指的是 github-pages:deploy 命令？据我了解，angular-cli-ghpages 已经取代了旧命令，旧命令已经不再可用。 - I Like

非常抱歉...你是对的，我指的是旧版本中已经被移除的 CLI 命令。 - snorkpete

Answer 3

尝试这个（适用于Mac）：

1. $ npm install -g angular-cli-ghpages

2. 将您的代码推送到Github仓库，然后在终端中运行此命令：ng build --env=prod --base-href "https://yourgithubusername.github.io/yourprojectname/" 这里的“yourprojectname”是您的Github仓库名称，而不是本地仓库。

3. 如果一切正常，然后运行：sudo angular-cli-ghpages 并输入密码。

- Abhijeet Khangarot