grunt-este-watchでscssファイルの最小サンプル

2013/10/21

こんばんは!

grunt-contrib-watchが重いなーって感じてて、
grunt-este-watchの記事を見て、このビックウェーブに乗るしかない!ってことで試してみました。

参考サイト
grunt-este-watch めっちゃ便利やんけ
grunt-contrib-watch が重いので grunt-este-watch を試したら幸せになった

GruntでSassとJSをごにょごにょしてる程度なので、お二人のように難しいことはよくわかりませんw
という訳で、scssファイルをcssファイルに変換して圧縮するだけのビルドサンプルのご紹介です。

最小サンプル

module.exports = function(grunt){
	grunt.initConfig({
		pkg: grunt.file.readJSON('package.json'),
		sass: {
			common: {
				options: {
					style: 'expanded'
				},
				files: {
					'_scss/style.min.css': '_scss/style.scss'
				}
			}
		},
		cssmin: {
			compress: {
				files: {
					'css/style.css': '_scss/style.min.css'
				}
			}
		},
		esteWatch: {
			options: {
				dirs: [ "_scss/","_scss/**/" ]
			},
			'scss': function(filepath) {
				return ['sass:common','cssmin:compress']
			}
		}
	});
	grunt.loadNpmTasks('grunt-contrib-sass');
	grunt.loadNpmTasks('grunt-contrib-cssmin');
	grunt.loadNpmTasks("grunt-este-watch");
	
	grunt.registerTask('default', ['esteWatch']);
}

誠に早くて賢いです。
まだ、grunt-contrib-watch使ってる人はぜひ試してみてください!
では!

About me
hosicame
昭和61年生まれ。フロントエンドエンジニア。Autohotkey大好きな私がお送りします。

Recent Posts