本投稿について

Gruntプラグインを紹介していくGrunt Plugins Advent Calendar 2013の12/1の投稿です。
さっき作ったばかりなので、まだすっきりさっぱりしたカレンダーになってますので、どうぞよろしくお願いします。
http://qiita.com/advent-calendar/2013/grunt-plugins

grunt-githooksとは

GitフックでGruntタスクを実行する仕込みをしてくれるGruntプラグインです。

https://npmjs.org/package/grunt-githooks
https://github.com/rhumaric/grunt-githooks

Gitフックとは

Gitではcommitやpush, rebase, checkoutなどいくつかの操作ができますが、それらの特定の操作を行ったときに、スクリプトを実行することができる仕組みがあり、それをGitフックと呼びます。

どんな種類のフックがあるのか

まずはソースコードをGitバージョン管理するために、git initで初期化してください。
% git init
すると、カレントディレクトリに.gitディレクトリが作られますが、その中の.git/hooksディレクトリにGitのクライアントサイドフックのサンプルが提供されています。

% tree -L 3 -a
.
|-- .git
|   |-- HEAD
|   |-- config
|   |-- description
|   |-- hooks
|   |   |-- applypatch-msg.sample
|   |   |-- commit-msg.sample
|   |   |-- post-update.sample
|   |   |-- pre-applypatch.sample
|   |   |-- pre-commit.sample
|   |   |-- pre-push.sample
|   |   |-- pre-rebase.sample
|   |   |-- prepare-commit-msg.sample
|   |   `-- update.sample
|   |-- info
|   |   `-- exclude
|   |-- objects
|   |   |-- info
|   |   `-- pack
|   `-- refs
|       |-- heads
|       `— tags

ファイル名を見ると想像できるように、pre-commit.sampleはcommitする直前にフックされるスクリプトのサンプル、pre-push.sampleはpushする直前にフックされるスクリプトのサンプル(Git 1.8.2以降対応)になります。
pre-commitやpre-pushという.sampleを除いた名前のファイルを作ると、commitやpushの各操作から呼ばれます。

導入

インストール

npm installでgrunt-githooksをインストールします。package.jsonのdevDependenciesに追加されるように--save-devオプションを忘れずに。
% npm install grunt-githooks --save-dev

Gruntfile.js

grunt-githooks タスクをロードするように追記し、githooksタスクを定義します。
以下はシェルスクリプトのテンプレートを使ったタスク定義の例です。
他にもtemplateにはNodeで定義できるnode_modules/grunt-githooks/templates/node.js.hbテンプレートを指定可能です。

module.exports = function(grunt) {
  grunt.initConfig({
    githooks: {
      options: {
        dest: '.git/hooks', //省略可
        hashbang: '#!/bin/sh',
        template: './node_modules/grunt-githooks/templates/shell.hb',
        startMarker: '## GRUNT-GRUNTHOOKS START',
        endMarker: '## GRUNT-GRUNTHOOKS END'
      },
      setup: {
        'pre-commit': 'git-pre-commit'
      }
    }
  });
  grunt.registerTask('git-pre-commit', [“jshint"]); // jshintタスクの定義は省略
  grunt.loadNpmTasks('grunt-githooks');
};

実行

% grunt githooks
Running "githooks:setup" (githooks) task

Binding `git-pre-commit` to `pre-commit` Git hook.
OK

Done, without errors.


% tree -L 3 -a
.
|-- .git
|   |-- HEAD
|   |-- config
|   |-- description
|   |-- hooks
|   |   |-- applypatch-msg.sample
|   |   |-- commit-msg.sample
|   |   |-- post-update.sample
|   |   |-- pre-applypatch.sample
|   |   |-- pre-commit
|   |   |-- pre-commit.sample
|   |   |-- pre-push.sample
|   |   |-- pre-rebase.sample
|   |   |-- prepare-commit-msg.sample
|   |   `-- update.sample
|   |-- info
|   |   `-- exclude
|   |-- objects
|   |   |-- info
|   |   `-- pack
|   `-- refs
|       |-- heads
|       `— tags

すると.git/hooks/pre-commit ファイルが生成されています。

% less .git/hooks/pre-commit
#!/bin/sh
## GRUNT-GRUNTHOOKS START
(cd /Users/shoito/workspaces/gac2013 && grunt git-pre-commit)

## GRUNT-GRUNTHOOKS END

pre-commitフックが仕込まれたので、さっそくgit commitして動作確認してみます。

% git commit
Running "jshint:gruntfile" (jshint) task
>> 1 file lint free.

Running "jshint:lib_test" (jshint) task
Linting lib/htmlparser.js ...ERROR
[L65:C35] W116: Expected '===' and instead saw '=='.
        if ( html.indexOf("<!--") == 0 ) {
[L70:C15] W116: Expected '{' and instead saw 'handler'.

              handler.comment( html.substring( 4, index ) );

(略)
Warning: Task "jshint:lib_test" failed. Use --force to continue.


Aborted due to warnings.

このケースでは、git commitしたがpre-commitフックで呼ばれるGruntタスクのjshintタスクによるコーディングルールのチェックをパスできず、git commitが失敗に終わりました。
警告に従い、コードを修正した後に再度git commitしましょう。

まとめ

このように、grunt-githooksプラグインを使い、チーム内で共通のGitフックを仕込んでおくことができます。
例えば、pre-commitフックにコーディングルールのチェックやテストのGruntタスクが呼ばれるように仕込んでおくと「誰だよ、テスト通ってないコードをpushしたやつは！？」という事態が防止できます。

Tips

コーディングルールのチェックやテスト(軽いもの)のGruntタスクの実行はファイル変更の監視を行っているwatchタスクに仕込んでおいて、PhantomJS/CasperJSなどを使ったUIテストのタスク(重いもの)はpre-commitフックから呼び出すようにしておくなどすると良いと思います。

Q&A

Q. なぜ、githooksタスクからわざわざgit-pre-commitを呼ぶようにしているか？

    setup: {
      'pre-commit': 'git-pre-commit'
    } 
(略)
grunt.registerTask('git-pre-commit', ['jshint']);

A. このようにしておくと、pre-commitタスクで実行したいGruntタスクに変更があっても、Gruntfile.jsの定義を更新すればよく、grunt githooksを実行して.git/hooks/pre-commitを更新する必要がないためです。この例のjshintだと軽すぎますが、うちではcasperjsが含まれた定義になってます。

Appendix

Grunt Plugins
http://gruntjs.com/plugins

Gitフックを仕込むgrunt-githooksについて紹介するよ