GruntでJS/CSSを結合/圧縮
環境構築は省略
Gruntfile.js
module.exports = function(grunt) { grunt.initConfig({ pkg: grunt.file.readJSON('package.json'), concat: { multiple_file: { files: { // 画面ごとに別ファイルを読み込みたいときは、カンマ区切りで記述 'js/test.js': ['js/jquery-1.11.0.min.js', 'js/bootstrap.min.js'] } } }, uglify: { js_uglify: { options: { banner: '/*! Banner Comment.\n\n <%= grunt.template.today("dd-mm-yyyy") %> */\n' }, files: { 'js/test.min.js': ['js/test.js'] } } }, cssmin: { add_banner: { options: { banner: '/* My minified css file */' }, files: { 'css/test.css': ['css/**/*.css'] } } } }); grunt.loadNpmTasks('grunt-contrib-uglify'); grunt.loadNpmTasks('grunt-contrib-concat'); grunt.loadNpmTasks('grunt-contrib-cssmin'); };
実行
$ grunt concat Running "concat:multiple_file" (concat) task File "js/test.js" created. Done, without errors. $ grunt uglify Running "uglify:js_uglify" (uglify) task File js/test.min.js created: 127.62 kB → 128.05 kB Done, without errors. $ grunt cssmin Running "cssmin:add_banner" (cssmin) task File css/test.css created: 158.75 kB → 122.79 kB Done, without errors.
ハマったこと。
こんな感じでシングルタスクとして定義すると、エラーになる。
grunt.registerTask('uglify', ['uglify']);
minifyはちょっと怪しいので様子見。
http://moqada.hatenablog.com/entry/2014/02/12/013203