Question

我一直在尝试将我的angular 2应用程序部署到github页面，这样我就可以在托管的github链接上查看应用程序，但到目前为止还没有运气。

我完成应用程序后，就运行了这些命令：

ng build --prod

git remote add origin "My REPO"
git commit -a
git push -u origin master

然后我尝试在终端上运行

ng github-pages:deploy

并收到此错误：

The specified command github-pages:deploy is invalid. For available options, see `ng help`.

经过研究后，我浏览了此页并按照说明操作：https://www.npmjs.com/package/angular-cli-github-pages

我在项目目录中通过npm安装了angular-cli-github-pages：

npm install --save-dev angular-cli-github-pages

它说我必须创建gh页面，所以我在下面运行了这个命令：

git checkout --orphan gh-pages

然后提交文件并推送更改并返回到origin master并运行deploy命令，它给了我同样的错误：

  The specified command github-pages:deploy is invalid. For available options, see `ng help`.

我一直在用不同的方法来回走动，但它不起作用。有人可以指出我应该做些什么来正确地将其部署到github页面？

Answer 1

我最近遇到了同样的问题。在对angular2社区进行了几个小时的搜索之后，我发现在最新的angular-cli版本中已经删除了angular-cli-github-pages模块。要将Angular 2应用程序部署到gh页面，您现在需要安装一个新的npm模块，它与旧的angular-cli-github-pages模块非常相似，但是可以让您比以前的模块做更多的工作。

npm模块是angular-cli-ghpages。您可以在模块的npmjs页面上找到文档和步骤。

希望这会对你有所帮助。

Answer 2

首先安装angular-cli ghpages

npm install -g angular-cli-ghpages

安装下一步后，链接您的存储库。运行此命令

ng build --prod --base-href "https://<user-name>.github.io/<repo>/"

如果您看到错误然后省略--prod并运行此命令

ng build --base-href "https://<user-name>.github.io/<repo>/"

您现在可以在angular 2 app目录中看到dist文件夹。

上传github存储库中dist文件夹的所有文件。

然后从设置启用Github页面。我们将为您提供一个链接。

就是这样。

演示：https://shawon100.github.io/angularmaterial/

Answer 3

我发现部署到Github Pages的最简单方法是使用master分支或master分支中的doc作为Settings中的source选项。我选择master分支选项中的文档，并将docs文件夹视为构建目录。它工作得很好。我只是推送到掌握，Github检测到docs文件夹，然后创建包含其内容的app / page。

Answer 4

要将Angular应用程序部署到Github，请执行以下步骤：

安装Angular-cli-ghpages npm包：

npm install -g angular-cli-ghpages
执行“ng build”以生成 dist 文件夹：

ng build --base-href“https：//.github.io//”
执行“ngh”（Angular-cli-ghpages）将网站发布到您的Github存储库。

sudo ngh --repo https://github.com/ / --no-silent

控制台将显示如下内容：

Cloning https://github.com/<username>/repo into ../../../../../../usr/local/lib/node_modules/angular-cli-ghpages/node_modules/gh-pages/.cache

Cleaning

Fetching origin

Checking out origin/gh-pages

Removing files

Copying files

Adding all

Committing

Pushing

Successfully published!

这会将您的本地 dist 文件夹推送到名为“ gh-pages ”的分支到 Github 存储库中。然后在 Github 存储库中，单击设置，转到 GitHub页面部分并选择“ gh-pages branch “在下拉选择器中。

注意：下次进行更改并想要部署应用时，请执行步骤2和3.请注意，需要花费一些时间（分钟）来刷新Github中的更改。< / p>

Answer 5

尝试使用 angular-cli-ghpages https://www.npmjs.com/package/angular-cli-ghpages

我认为您能够将代码成功地推送到仓库中。确保以下内容到位：

Angular Cli版本应为8 +。
回购应该是公开的而不是私人的-导航至设置并将回购更改为公开
尝试以下命令：ng deploy --repo = https://github.com/ /- base-href = https：//.github.io//

检查“网络”标签以查看捆绑软件是否已成功加载，否则请清除一次缓存，然后尝试：ctrl + shift + R。

将angular 2 app部署到github页面 - 失败

5 个答案: