load-grunt-configでGruntfileを分割するときの注意点

initConfigは指定しちゃダメ

Grantfile内にinitConfigを残すとエラーになります。

設定ファイル内はモジュール名省略

load-grunt-configは./grunt以下に配置した モジュール名.js を読み込みます。
このとき設定ファイルの中ではモジュール名を省略します。

Gruntfile内に書くとき

grunt.initConfig({
	watch: {
    	options: {
			open: true,
        	port: 9000,
        	livereload: 35729,
        	hostname: 'localhost',
			base: 'app'
    	}
	}
});

分割するとき(grunt/watch.js)

module.exports = {
    options: {
		open: true,
        port: 9000,
        livereload: 35729,
        hostname: 'localhost',
		base: 'app'
    }
};

##カスタム設定の取り回し方
通常、initConfig内に書いた設定はテンプレートを用いて書くconfig内で取り回すことができますが、load-grunt-configを使う際はinitConfigを書けないので、この方法は使えません。

Gruntfile

grunt.initConfig({
	settings: {
		app: "app",
		disp: "dist"
	},
	watch: {
    	options: {
			open: true,
        	port: 9000,
        	livereload: 35729,
        	hostname: 'localhost',
			base: <%= settings.app %>
    	}
	}
});

方法１:カスタム設定ファイルを用意する

grunt/settings.jsのようにファイルを作って、他の設定ファイル同様に記述することで、
従来通りテンプレートで値を取り回すことができます。

grunt/settings.js

module.exports = {
    app: "app",
	disp: "dist"
};

方法２:package.jsonに指定する

package.jsonは自動的に読み込まれ、 package プロパティでアクセスすることができます。
以下のように設定すると、各Configファイル内から<%= package.settings.app %>のようにしてアクセスできます。

package.json

{
  "name": "grunt-maccotsan",
  "version": "0.0.0",
  "dependencies": {},
  "devDependencies": {
    "grunt": "~0.4.1",
    "grunt-contrib-watch": "~0.5.2",
    "load-grunt-config": "~0.7.1",
  },
  "engines": {
    "node": ">=0.8.0"
  },
  "settings": {
    "app": "app-frontend",
    "dist": "dist"
  }
}

タスク内から設定を使う

grunt.config()で呼び出せます。

Gruntfile

grunt.registerTask('default', function() {
 	grunt.log.writeln('app:' + grunt.config('package.settings.app'));

	grunt.task.run([
    	'connect:livereload',
   		'watch'
   ]);
});

参考URL

タスクの作成 | Grunt 日本語リファレンス | js STUDIO
I am mitsuruog: Yeomanに学ぶモテるGruntfile.jsの書き方