grunt配置示例

gruntfile.js

module.exports = function(grunt) {

    // 构建任务配置
    grunt.initConfig({
        //读取package.json的内容，形成个json数据
        pkg: grunt.file.readJSON('package.json'),
        dirs: {
            src: 'src',
            //dest: 'dist/<%= pkg.name %>/<%= pkg.version %>',
            dest: 'build',
        },
        //转换为HTMl
        jade: {
            compile: {
                options: {
                    data: {
                        debug: true,
                        timestamp: "<%= new Date().getTime() %>"
                    },
                    pretty: true
                },
                files: [{
                    expand: true,
                    //目录
                    cwd: '<%= dirs.src %>',
                    src: ['*.jade'],
                    //输出目录
                    dest: '<%= dirs.src %>',
                    ext: '.html'
                }]
                // files: {
                //     "<%= dirs.src %>/index.html": ["<%= dirs.src %>/index.jade"]
                // }
            }
        },
        //转换为css
        less: {
            development: {
                options: {
                    //paths: ["src/"],
                    compress: true
                },
                files: [{
                    expand: true,
                    //目录
                    cwd: '<%= dirs.src %>',
                    src: ['*.less'],
                    //输出目录
                    dest: '<%= dirs.src %>',
                    ext: '.css'
                }]
            }
        },
        //sass
        sass: {
            dist: {
                options: {
                    style: 'compressed'
                    //compass : true
                },
                files: [{
                    expand: true,
                    //目录
                    cwd: '<%= dirs.src %>',
                    src: ['*.scss'],
                    //输出目录
                    dest: '<%= dirs.src %>',
                    ext: '.css'
                }]
            }
        },
        //复制文件
        copy: {
            main: {
                files: [{
                    expand: true,
                    cwd: '<%= dirs.src %>',
                    src: ['*.js', '!*.min.js'],
                    dest: '<%= dirs.dest %>',
                    ext: '.js'
                }, {
                    expand: true,
                    cwd: '<%= dirs.src %>',
                    src: ['*.css', '!*.min.css'],
                    dest: '<%= dirs.dest %>',
                    ext: '.css'
                }]
            }
        },
        //css压缩合并
        cssmin: {
            //文件头部输出信息
            options: {
                banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd h:MM:ss TT") %> */\n',
            },
            minify: {
                //表示下面文件名的占位符都要扩展成具体的文件名
                expand: true,
                //目录
                cwd: '<%= dirs.dest %>',
                src: ['*.css', '!*.min.css'],
                //输出目录
                dest: '<%= dirs.dest %>',
                ext: '.min.css'
            }
        },
        //合并js
        concat: {
            options: {
                //
            },
            // dist: {
            //     //表示下面文件名的占位符都要扩展成具体的文件名
            //     expand: true,
            //     //目录
            //     cwd: '<%= dirs.dest %>',
            //     src: ['*.js', '!*.min.js'],
            //     //输出目录
            //     dest: '<%= dirs.dest %>',
            //     ext: '-all.js'
            // }
            dist: {
                src: ['<%= dirs.dest %>/common.js'],
                dest: '<%= dirs.dest %>/all.js',
            },
        },
        //检查js错误
        jshint: {
            options: {
                //忽略“W117”报错
                '-W117': true,
                //大括号包裹
                curly: true,
                //对于简单类型，使用===和!==，而不是==和!=
                eqeqeq: true,
                //对于首字母大写的函数（声明的类），强制使用new
                newcap: true,
                //禁用arguments.caller和arguments.callee
                noarg: true,
                //对于属性使用aaa.bbb而不是aaa['bbb']
                sub: true,
                //查找所有未定义变量
                undef: true,
                //查找类似与if(a = 0)这样的代码
                boss: true,
                //指定运行环境为node.js
                node: true,
                //这里是覆盖JSHint默认配置的选项
                globals: {
                    jQuery: true,
                    console: true,
                    module: true,
                    document: true
                }
            },
            //具体任务配置
            files: ['src/common.source.js'],
            beforeconcat: ['src/common.source.js']
            //afterconcat: ['dist/output.js']
        },
        //js压缩
        uglify: {
            //文件头部输出信息
            options: {
                banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd h:MM:ss TT") %> */\n',
                beautify: {
                    //中文ascii化，非常有用！防止中文乱码的神配置
                    ascii_only: true
                }
            },

            //具体任务配置
            build: {
                //表示下面文件名的占位符都要扩展成具体的文件名
                expand: true,
                //目录
                cwd: '<%= dirs.dest %>',
                src: ['*.js', '!*.min.js'],
                //输出目录
                dest: '<%= dirs.dest %>',
                ext: '.min.js'
            }
        },
        // 压缩html任务
        htmlmin: {
            //目标
            dist: {
                //目标选项
                options: {
                    removeComments: true,
                    collapseWhitespace: true,
                    //Replace doctype with the short HTML5 version <!DOCTYPE html>.
                    useShortDoctype: true
                },
                files: [{
                    //表示下面文件名的占位符都要扩展成具体的文件名
                    expand: true,
                    //目录
                    cwd: '<%= dirs.src %>',
                    src: ['*.html', '!*.min.html'],
                    //输出目录
                    dest: '<%= dirs.src %>',
                    ext: '.min.html'
                }]
            }
        },
        //图片压缩
        imagemin: {
            static: {
                files: [{
                    //表示下面文件名的占位符都要扩展成具体的文件名
                    expand: true,
                    //目录
                    cwd: '<%= dirs.src %>/images/',
                    src: ['*.{png,jpg,gif}'],
                    //输出目录
                    dest: '<%= dirs.dest %>/images/'
                    //ext: ''
                }]
            }
        },
        //在本机运行一个Web Server
        connect: {
            options: {
                //端口号
                port: 9000,
                //保持运行状态\
                //运行grunt connect后，打开的页面
                open: 'http://localhost:9000'
            },
            server: {
                options: {
                    middleware: function(connect, options) {
                        return [
                            require('connect-livereload')({
                                port: 35729
                            }),
                            // Serve static files.  
                            connect.static('src/'),
                        ];
                    }
                }
            }
        },
        watch: {
            options: {
                livereload: 35729
            },
            server: {
                files: ['<%= dirs.src %>/*.less', '<%= dirs.src %>/*.scss', '<%= dirs.src %>/*.jade'],
                tasks: ['less','jade','sass','copy','cssmin', 'concat','uglify','imagemin'],

            }
        }


    });

    //载入插件
    grunt.loadNpmTasks('grunt-contrib-jade');
    grunt.loadNpmTasks('grunt-contrib-less');
    grunt.loadNpmTasks('grunt-contrib-sass');
    grunt.loadNpmTasks('grunt-contrib-copy');
    grunt.loadNpmTasks('grunt-contrib-cssmin');
    grunt.loadNpmTasks('grunt-contrib-concat');
    grunt.loadNpmTasks('grunt-contrib-uglify');
    grunt.loadNpmTasks('grunt-contrib-watch');
    grunt.loadNpmTasks('grunt-contrib-connect');
    grunt.loadNpmTasks('grunt-contrib-htmlmin');
    grunt.loadNpmTasks('grunt-contrib-imagemin');
    //grunt.loadNpmTasks('grunt-contrib-jshint');
    //grunt.loadNpmTasks('grunt-contrib-qunit');
    grunt.event.on('watch', function(action, filepath, target) {
        grunt.log.writeln(target + ': ' + filepath + ' has ' + action);
    });

    //注册任务
    //只需在命令行上输入"grunt"，就会执行default task
    grunt.registerTask('default', ['copy', 'cssmin', 'uglify']);
    grunt.registerTask('server', ['connect', 'watch']);
    grunt.registerTask('demo', [ 'jade', 'copy', 'cssmin', 'concat', 'uglify', 'connect', 'watch']);
};