kimizuka.hatenablog.com
kimizuka.hatenablog.com
以前、GruntからGulpに移行しかけたんですが、なんだかんだでGruntに戻ってきてしまいました。
Jadeも導入して、Gruntファイルを更新したのでメモを残しておきます。
ディレクトリ構成
以前のものから、Jadeでコンパイルするファイルをまとめたファイル( pagelist.json )が増えました。
package.json
{ "name": "HigeGrunt", "version": "0.0.1", "description": "hello world.", "repository": { "type": "git", "url": "https://github.com/kimizuka/HigeGrunt.git" }, "devDependencies": { "grunt-contrib-copy": "~0.5.0", "grunt-contrib-compass": "~0.8.0", "grunt-contrib-jshint": "~0.1.1", "grunt-contrib-concat": "~0.1.2", "grunt-contrib-uglify": "~0.1.1", "grunt-contrib-watch": "~0.2.0", "grunt-contrib-connect": "~0.8.0", "grunt-contrib-imagemin": "~0.8.0", "grunt-contrib-jade": "~0.14.1", "grunt-contrib-clean": "~0.6.0", "grunt-contrib-cssmin" : "~0.10.0", "grunt-combine-media-queries": "~1.0.19", "grunt-bower-task": "~0.3.4", "grunt-autoprefixer": "~0.7.5", "grunt-usemin": "~2.0.0", "grunt-csscomb": "~3.0.0" } }
Gruntfile.js
module.exports = function (grunt) { 'use strict'; var srcFiles = grunt.file.readJSON('scripts.json'), pageList = grunt.file.readJSON('pagelist.json'); grunt.initConfig({ pkg: grunt.file.readJSON('package.json'), // grunt-contrib-copy copy: { dist: { files: [{ expand: true, cwd: 'build/', src: ['*.html', '*.mp3', '*.ogg', '*.wav', '*.mp4', '*.mov', '*.swf'], dest: 'dist/' }] }, takeout: { files: [{ expand: true, cwd: 'dist/', src: ['*.html', 'data/**/*'], dest: './' }] } }, // grunt-contrib-compass compass: { dev: { options: { config: 'build/config.rb', sassDir: 'build/sass', cssDir: 'build/data/css' } }, dist: { options: { config: 'build/config.rb', sassDir: 'build/sass', cssDir: 'dist/data/css' } } }, // grunt-contrib-concat concat: { dist: { src: srcFiles.app, dest: 'build/data/js/main.concat.js' } }, // grunt-contrib-uglify uglify: { options: { banner: '' }, dist: { files: { 'dist/data/js/main.min.js': ['<%= concat.dist.dest %>'] } } }, // grunt-contrib-jshint jshint: { files: ['<%= concat.dist.src %>'], options: { jquery: true, browser: true, devel: true, validthis: true } }, // grunt-contrib-watch watch: { compass: { files: ['build/sass/**/*.scss'], tasks: ['compass:dev', 'autoprefixer:dev'] }, js: { files: ['<%= concat.dist.src %>'], tasks: ['jshint', 'concat'] }, jade: { files: ['build/jade/**/*.jade'], tasks: ['jade'] } }, // grunt-contrib-connect connect: { server: { options: { port: 9000, open: true, keepalive: false, hostname: '*', base: 'build' } } }, // grunt-contrib-imagemin imagemin: { dynamic: { files: [{ expand: true, cwd: 'build/data/img/', src: ['**/*.{png,jpg,gif,ico}'], dest: 'dist/data/img/' }] } }, // contrib-clean clean: { dist: { files: [{ dot: true, src: [ 'dist', ] }] } }, // contrib-cssmin cssmin: { dist: { files: { 'dist/data/css/main.css': ['dist/data/css/*.css'] }, options: { noAdvanced: true, } } }, // combine-cmq cmq: { options: { log: false }, dist: { files: { 'dist/data/css/main.css': ['dist/data/css/*.css'] } } }, // grunt-bower-task bower: { dev: { options: { targetDir: 'build/data/js/lib', layout: 'byType', install: true, verbose: false, cleanTargetDir: true, cleanBowerDir: false } }, install: { options: { targetDir: 'dist/data/js/lib', layout: 'byType', install: true, verbose: false, cleanTargetDir: true, cleanBowerDir: false } } }, // grunt-autoprefixer autoprefixer: { options: { browsers: ['last 2 version', 'ie 9'] }, dev: { src: 'build/data/css/*.css' }, dist: { src: 'dist/data/css/*.css' } }, // grunt-usemin usemin: { html: ['dist/*.html'], options: { root: '/', dirs: ['dist'] } }, // csscomb csscomb: { dev: { files: { 'build/data/css/main.css': ['build/data/css/*.css'] } }, dist: { files: { 'dist/data/css/main.css': ['dist/data/css/*.css'] } } }, // jade jade: { compaile: { options: { pretty: true }, files: pageList } } }); grunt.registerTask('default', ['server']); grunt.registerTask('dev', ['bower:dev', 'compass:dev', 'autoprefixer:dev', 'csscomb:dev', 'jshint', 'concat', 'jade']); grunt.registerTask('server', ['dev', 'connect', 'watch']); grunt.registerTask('dist', ['jshint', 'clean:dist', 'concat', 'uglify', 'imagemin:dynamic', 'bower:install', 'compass:dist', 'autoprefixer:dist', 'cmq', 'csscomb:dist', 'cssmin', 'copy:dist', 'jade', 'usemin']); grunt.registerTask('takeout', ['dist', 'copy:takeout']); grunt.loadNpmTasks('grunt-contrib-copy'); grunt.loadNpmTasks('grunt-contrib-compass'); grunt.loadNpmTasks('grunt-contrib-concat'); grunt.loadNpmTasks('grunt-contrib-uglify'); grunt.loadNpmTasks('grunt-contrib-jshint'); grunt.loadNpmTasks('grunt-contrib-watch'); grunt.loadNpmTasks('grunt-contrib-connect'); grunt.loadNpmTasks('grunt-contrib-imagemin'); grunt.loadNpmTasks('grunt-contrib-clean'); grunt.loadNpmTasks('grunt-contrib-cssmin'); grunt.loadNpmTasks('grunt-combine-media-queries'); grunt.loadNpmTasks('grunt-bower-task'); grunt.loadNpmTasks('grunt-contrib-jade'); grunt.loadNpmTasks('grunt-autoprefixer'); grunt.loadNpmTasks('grunt-usemin'); grunt.loadNpmTasks('grunt-csscomb'); };
/build で作業して /dist に書き出しています。
今回は以上です。