我的grunt配置

module.exports = function(grunt) {

    // 配置.
    grunt.initConfig({
        pkg: grunt.file.readJSON('package.json'),
        watch: {
            css: {
                files: 'static/introduce/scss/**/*.scss',
                tasks: ['clean:css','compass'],
                options: {
                    livereload: true
                }
            } ,
            includereplace:{
                files:'src/html/**/*.html',
                tasks:['includereplace','copy:html','clean:html']
            }

        },
        jshint:{//js代码检测工具
            options: {
                jshintrc: '.jshintrc'
            },
            src: ["src/static/introduce/js/app/**/*.js"]
        },
        includereplace: {//包含html片段
            nav: {
                files: [
                    {src: 'src/html/**/*.html', dest: '.tmphtml/'}
                ]
            }
        },
        uglify: {//js压缩
            options: {
                banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */\n'
            },
            js: {
                files: [{
                    expand: true,
                    cwd: 'static/introduce/js',
                    src: '**/*.js',
                    dest: 'static/introduce/js',
                    ext:".min.js"
                }]
            }
        },
        compass: {//compass
            dev: {
                options: {
                    sassDir: 'static/introduce/scss',
                    cssDir: 'static/introduce/css',
                    outputStyle:'compressed',
                    noLineComments: true
                }
            }
        },
        clean: {//清除
            mod:["static/introduce/css/module"],
            css:["static/introduce/css"],
            html:[".tmphtml/"]
        },
        copy: {//复制
            css: {
                expand: true,
                cwd: 'static/introduce/css/',
                src: '**',
                dest: '../../src/SVipSys/SVipSys.Web/static/Introduce/css',
                flatten: true,
                filter: 'isFile'
            },
            scss:{
                expand: true,
                cwd: 'static/introduce/scss/',
                src: '**',
                dest: '../../src/SVipSys/SVipSys.Web/static/Introduce/scss'
            },
            html:{
                expand: true,
                cwd: '.tmphtml/src/html/',
                src: '**',
                dest: 'view/'
            }
        },
        imagemin:{//图片压缩
            dynamic: {
                files: [{
                    expand: true,
                    cwd: 'static/',
                    src: ['**/*.{png,jpg,gif}'],
                    dest: 'static/'
                }]
            }
        }
    });

    // 加载任务
    grunt.loadNpmTasks('grunt-contrib-uglify');
    grunt.loadNpmTasks('grunt-contrib-compass');
    grunt.loadNpmTasks('grunt-contrib-clean');
    grunt.loadNpmTasks('grunt-contrib-watch');
    grunt.loadNpmTasks('grunt-contrib-copy');
    grunt.loadNpmTasks('grunt-include-replace');
    grunt.loadNpmTasks('grunt-contrib-jshint');
    grunt.loadNpmTasks('grunt-contrib-imagemin');

    // 任务列表
    grunt.registerTask('default',['clean:css','compass','clean:mod',,'watch']);
    grunt.registerTask('tpl',['includereplace','copy:html','clean:html']);

};

写在后面的话,最初听到grunt这个词的时候,是在去年上半年,当时前端构建工具非常火,我一直觉得它是一个非常高大上的东西,后来发现真的只是个工具而已。大神们说,你们不应该被工具所累,因为工具是学不完的。是的,我们不需要跟风,但不代表不必要用。很多是项目需求,比如你在入职后接手了一些新的项目,那么,最好就是学习它,掌握它。使用grunt的时候,确实感到了方便之处,比如图片压缩、js压缩、代码检测。。。工具,它是帮我们干活,减少重复、无聊的工作量的。所以,使用它的时候,我们应该明确的知道,希望它能帮我们干什么活,而不是对着API写一堆配置都不知道在干嘛。。。

posted on 2015-06-18 16:53  叫我钱了个浅  阅读(202)  评论(0编辑  收藏  举报

导航