如何将我的AngularJS静态站点上传到Github Pages?

时间:2013-07-14 20:20:59

标签: angularjs github yeoman github-pages git-subtree

我已经使用AngularJS创建了一个静态网站,现在想要将其作为Github页面上传。我已按照此处的所有说明进行操作

https://help.github.com/articles/creating-project-pages-manually

我可以创建一个名为gh-pagesgit push origin gh-pages的新分支,我的所有内容都很好。当我进入我的仓库时,我看到新的gh-pages分支,其中包含所有文件

https://github.com/siddhion/maxmythic_angular/tree/gh-pages

问题在于,当我尝试在http://siddhion.github.io/maxmythic_angular/查看我的网站时,我只获得了404页面。我认为问题是我在顶层目录中没有index.html。它实际上位于app目录中。我的目录结构看起来就是这样,因为我是通过Yeoman创建的。我假设我需要顶级的所有文件。或许这个假设我错了?

如何让我的AngularJS静态网站正常显示?

更新

我按照斯蒂芬提供的步骤进行操作。我到了第3步,我收到了一个错误:

$ git subtree push --prefix dist origin gh-pages
git push using:  origin gh-pages
To git@github.com:siddhion/maxmythic_angular.git
 ! [rejected]        5db3233d7c0822eedc5500409ce6a2d4b73ad427 -> gh-pages (non-fast-forward)
error: failed to push some refs to 'git@github.com:siddhion/maxmythic_angular.git'
hint: Updates were rejected because a pushed branch tip is behind its remote
hint: counterpart. Check out this branch and merge the remote changes
hint: (e.g. 'git pull') before pushing again.
hint: See the 'Note about fast-forwards' in 'git push --help' for details.

然后我尝试了

$ git pull origin master
From github.com:siddhion/maxmythic_angular
 * branch            master     -> FETCH_HEAD
Already up-to-date.

然后再次尝试git subtree push --prefix dist origin gh-pages,但遇到了同样的错误。

在Yeoman部署页面,我看到一些常见错误部分

  

您可能会收到类似的错误因为提示而拒绝更新   目前的分支机构落后了。你可以通过强制推动解决这个问题   到遥远的地方(但要小心,它会破坏已经存在的东西   有)。

我很担心强迫subtree push,因为我一般都是git的新手,不知道会被摧毁的是什么。我的意思是,我目前在我的maxmythic_angular gh-pages遥控器上没有origin分支,所以我并不担心,但我有mastergh-pages-old和{{1那里的分支。如果我运行gh-pages-v1,它们会被销毁吗?

2 个答案:

答案 0 :(得分:13)

Yeoman网站上有一个deployment guide,用于如何使用git subtree部署到gh-pages分支。

从指南......

当你运行grunt build时,它会在可以部署的dist目录中生成一个完全优化的应用程序版本。

部署dist目录的推荐方法是使用git子树。

  1. 从.gitignore文件中删除dist目录。

  2. 将dist目录添加到您的存储库并将其与您的项目一起提交。

    git add dist && git commit -m "Initial dist subtree commit"

  3. 一旦dist目录成为项目的一部分,我们就可以使用git子树在不同的分支上设置一个单独的存储库。注意:前缀必须是dist目录的相对路径。这假设dist在您的根目录中。

    git subtree push --prefix dist origin gh-pages

  4. 现在您可以在默认(主)分支中提交整个存储库,并且只要您想部署dist目录,就可以运行:

    git subtree push --prefix dist origin gh-pages

答案 1 :(得分:0)

I recommend using grunt-build-control. The usage guide there is exactly your case.

I have used it to deploy my user.github.io, where the actual code is in branch source, and the optimized web page is built in local dist folder (in .gitignore) and then deployed to branch master using grunt buildcontrol:dist

buildcontrol: {
  dist: {
    options: {
      remote: 'https://github.com/user/user.github.io',
      branch: 'master',
      commit: true,
      push: true
  }
}