grunt dynamic task on watch event

别等时光非礼了梦想. 提交于 2019-12-24 12:33:44

问题


Hi i have a problem i need to watch less tasks for different directory. I need a method to edit the less task and instead to duplicate them i need to use a variable dir inside it.

there is my code:

module.exports = function(grunt) {

grunt.initConfig({
    pkg : grunt.file.readJSON('package.json'),

    dirLess : 'less',
    dirCss : 'css',
    dirImages : 'images',
    dirDT : 'theme-cdt',
    dirPB : 'theme-cpb',
    dirMCS : 'theme-cmcs',
    dirSprites : '<%= dirImages %>/sprites',
    dirIconFont : './fonts',
    dirCssMin : '<%= dirCss %>/min',
    less : {
        devDT : {
            options : {
                outputSourceFiles: true,
                sourceMap : true,
                sourceMapFilename : '<%= dirDT %>/<%= dirCss %>/style.css.map',
                sourceMapBasepath : '<%= dirDT %>/<%= dirCss %>/',
            },
            files : {
                '<%= dirDT %>/<%= dirCss %>/style.css' : '<%= dirDT %>/<%= dirLess %>/style.less'
            },
        },
        devIeDT : {
            files : {
                '<%= dirDT %>/<%= dirCss %>/style-ie9-bootstrap.css': '<%= dirDT %>/<%= dirLess %>/style-bootstrap.less',
                '<%= dirDT %>/<%= dirCss %>/style-ie9-common.css': '<%= dirDT %>/<%= dirLess %>/style-common.less',
                '<%= dirDT %>/<%= dirCss %>/style-ie9-view.css': '<%= dirDT %>/<%= dirLess %>/style-view.less',
                '<%= dirDT %>/<%= dirCss %>/style-ie8.css': '<%= dirDT %>/<%= dirLess %>/style-ie8.less'
            },
        },
        devPB : {
            options : {
                outputSourceFiles: true,
                sourceMap : true,
                sourceMapFilename : '<%= dirPB %>/<%= dirCss %>/style.css.map',
                sourceMapBasepath : '<%= dirPB %>/<%= dirCss %>/',
            },
            files : {
                '<%= dirPB %>/<%= dirCss %>/style.css' : '<%= dirPB %>/<%= dirLess %>/style.less'
            },
        },
        devIePB : {
            files : {
                '<%= dirPB %>/<%= dirCss %>/style-ie9-bootstrap.css': '<%= dirPB %>/<%= dirLess %>/style-bootstrap.less',
                '<%= dirPB %>/<%= dirCss %>/style-ie9-common.css': '<%= dirPB %>/<%= dirLess %>/style-common.less',
                '<%= dirPB %>/<%= dirCss %>/style-ie9-view.css': '<%= dirPB %>/<%= dirLess %>/style-view.less',
                '<%= dirPB %>/<%= dirCss %>/style-ie8.css': '<%= dirPB %>/<%= dirLess %>/style-ie8.less'
            },
        },
        devMCS : {
            options : {
                outputSourceFiles: true,
                sourceMap : true,
                sourceMapFilename : '<%= dirMCS %>/<%= dirCss %>/style.css.map',
                sourceMapBasepath : '<%= dirMCS %>/<%= dirCss %>/',
            },
            files : {
                '<%= dirMCS %>/<%= dirCss %>/style.css' : '<%= dirMCS %>/<%= dirLess %>/style.less'
            },
        },
        devIeMCS : {
            files : {
                '<%= dirMCS %>/<%= dirCss %>/style-ie9-bootstrap.css': '<%= dirMCS %>/<%= dirLess %>/style-bootstrap.less',
                '<%= dirMCS %>/<%= dirCss %>/style-ie9-common.css': '<%= dirMCS %>/<%= dirLess %>/style-common.less',
                '<%= dirMCS %>/<%= dirCss %>/style-ie9-view.css': '<%= dirMCS %>/<%= dirLess %>/style-view.less',
                '<%= dirMCS %>/<%= dirCss %>/style-ie8.css': '<%= dirMCS %>/<%= dirLess %>/style-ie8.less'
            },
        }
    },
    watch : {
        devDT : {
            files : [ '<%= dirDT %>/<%= dirLess %>/*.less', '<%= dirDT %>/<%= dirLess %>/bootstrap-less/*.less', '<%= dirDT %>/<%= dirLess %>/bootstrap-less/mixins/*.less',
                      '<%= dirDT %>/<%= dirLess %>/common/*.less', '<%= dirDT %>/<%= dirLess %>/components/*.less', '<%= dirDT %>/<%= dirLess %>/plugin/*.less', '<%= dirDT %>/<%= dirJsAcc %>/*.js',
                      '<%= dirDT %>/<%= dirIconFont %>/_iconfont.less', 'Gruntfile.js' ], // '<%= dirJs %>/*.js'
            tasks : [ 'less:devDT', 'less:devIeDT' ], // 'uglify:dev', 'autoprefixer:all'
            options : {
                livereload: 12344,
                reload: true
            },
        },
        devPB : {
            files : [ '<%= dirPB %>/<%= dirLess %>/*.less', '<%= dirPB %>/<%= dirLess %>/bootstrap-less/*.less', '<%= dirPB %>/<%= dirLess %>/bootstrap-less/mixins/*.less',
                      '<%= dirPB %>/<%= dirLess %>/common/*.less', '<%= dirPB %>/<%= dirLess %>/components/*.less', '<%= dirPB %>/<%= dirLess %>/plugin/*.less', '<%= dirPB %>/<%= dirJsAcc %>/*.js',
                      '<%= dirPB %>/<%= dirIconFont %>/_iconfont.less', 'Gruntfile.js' ], // '<%= dirJs %>/*.js'
            tasks : [ 'less:devPB', 'less:devIePB' ], // 'uglify:dev', 'autoprefixer:all'
            options : {
                livereload: 12346,
                reload: true
            },
        },
        devMCS : {
            files : [ '<%= dirMCS %>/<%= dirLess %>/*.less', '<%= dirMCS %>/<%= dirLess %>/bootstrap-less/*.less', '<%= dirMCS %>/<%= dirLess %>/bootstrap-less/mixins/*.less',
                      '<%= dirMCS %>/<%= dirLess %>/common/*.less', '<%= dirMCS %>/<%= dirLess %>/components/*.less', '<%= dirMCS %>/<%= dirLess %>/plugin/*.less', '<%= dirMCS %>/<%= dirJsAcc %>/*.js',
                      '<%= dirMCS %>/<%= dirIconFont %>/_iconfont.less', 'Gruntfile.js' ], // '<%= dirJs %>/*.js'
            tasks : [ 'less:devMCS', 'less:devIeMCS' ], // 'uglify:dev', 'autoprefixer:all'
            options : {
                livereload: 12347,
                reload: true
            },
        }
    },
    concurrent: {
        all: {
            tasks: ['watch:devDT', 'watch:devPB', 'watch:devMCS'],
            options: {
                logConcurrentOutput: true
            }
        }
    }
});

grunt.loadNpmTasks('grunt-contrib-less');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-concurrent');

grunt.registerTask('default', [ 'less:devMCS', 'less:devIeMCS', 'less:devPB', 'less:devIePB', 'less:devDT', 'less:devIeDT' ]);
grunt.registerTask('conc', ['concurrent:all'])
// grunt.registerTask('mcs', [ 'watch:devMCS' ]);
// grunt.registerTask('pb', [ 'watch:devPB' ]);
// grunt.registerTask('dt', [ 'watch:devDT' ]);
};

I need to compact all the same less task in one generic that can be used dynamically with one less:dev passing the directory to the task.

i search in internet, the only thing that i found is use global variable on task call, but when this event are nested in other event this variable are lost in nested event (e.g. watch task take the variable but the less task runing inside this watch task are lost and not set).

thanks


回答1:


Use arguments passed to your tasks to make on the fly "custom" tasks. For example:

watch: {
    service: {
        files: ['src/**/*.*'],
        tasks: ['<%= grunt.task.current.args[1] %>']
    }
}

Then you can pass in values (myARG in this case) to the task:

grunt.registerTask('serve', ['build', 'watch:service:myARG']);

Which makes the task equivalent to

watch: {
    service: {
        files: ['src/**/*.*'],
        tasks: ['myARG']
    }
}

You can pass in multiple values with more colons : if you need to.



来源:https://stackoverflow.com/questions/27193062/grunt-dynamic-task-on-watch-event

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!