Gruntの使い方:タスクをまとめて実行

前回の続きです。
コマンドプロンプトを package.json のあるプロジェクトフォルダへ移動しておいてください。

module.exports = function(grunt) {
  grunt.initConfig({
    cssmin: {
      compress: {
        files: {
          './css/min.css':['css/reset.css','css/style.css']
        }
      }
    },
    watch: {
      files:['css/*.css'],
      tasks:['cssmin']
    }
  });
  grunt.loadNpmTasks('grunt-contrib-cssmin');
  grunt.loadNpmTasks('grunt-contrib-watch');
};

Gruntfile.js が上記のようになっている場合、タスク「cssmin」と「watch」が存在する状態なので、それぞれ下記のコマンドで実行できます。

grunt cssmin
grunt watch

タスクが多くなると面倒ですし、複数人でプロジェクトを共有するときにタスク名も複数人で覚えて実行するのは手間です。
下記のように Gruntfile.js へ registerTask を追記してください。

module.exports = function(grunt) {
  grunt.initConfig({
    cssmin: {
      compress: {
        files: {
          './css/min.css':['css/reset.css','css/style.css']
        }
      }
    },
    watch: {
      files:['css/*.css'],
      tasks:['cssmin']
    }
  });
  grunt.loadNpmTasks('grunt-contrib-cssmin');
  grunt.loadNpmTasks('grunt-contrib-watch');

  //追記
  grunt.registerTask('default', ['cssmin', 'watch']);
};

コマンドプロンプトへ下記のコマンドを打ってください。

grunt

registerTaskに「default」と設定することで、登録したタスクを順に実行させられます。