计算机那些事网站

grunt-gh-pages: Deploy Your Website into GitHub Pages

Recently, I am learning AngularJS, and I “believe” I have some progress, so that I cannot wait to puslish my work to the public. This is the repository for the AngularJS demo I write in GitHub. And I publish this work at this link: http://sbzhouhao.net/TodoApp-AngularJS-Firebase/#/todo, which is a static page hosted in GitHub Pages.

The easiest and most intuitive way is to copy all the files in dist to gh-pages branch of my new repository. But I just wonder is there any other solution for this? As I know hexo has a command: 

1
hexo deploy -m "XXXXXX"

to deploy your website.

Then, I just try my luck. Awesome! There is something called grunt-gh-pages.

What I do is as following:

1. Add grunt-gh-pages configyration into Gruntfile.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
grunt.initConfig({

true// More code here

    // deploy to GitHub pages
    'gh-pages': {
      options: {
        base: 'dist',
        branch: 'gh-pages',
        repo: 'https://github.com/zhouhao/TodoApp-AngularJS-Firebase.git'
      },
      src: '**/*'
    }

    // More code here

});

###2. Register a task as deploy [This is optional, but I like the the way from hexo, so I register it as deploy]

1
2
3
grunt.registerTask('deploy', [
    'gh-pages'
]);

###Therefore, if you want to publish your website into GitHub Pages, you can:

1
2
3
4
# This will generate the dist folder, which contain everything about the website
grunt build
# This will deploy everything in dist folder into new gh-pages branch in defined repository
grunt deploy