generics - Grunt: How to generically run less task on multiple files that the watch task detects? -
how can set grunt script run less task on multiple files watch task detects? is possible without using "grunt.event.on('watch'..." hack?
this solution works 1 file, when 2 files saved @ same time (in visual studio) 1 css generated.
the script:
'usestrict'; module.exports = function (grunt) { grunt.initconfig({ globalconfig: globalconfig, less: { all: { options: { compress: false, }, files: '', }, }, watch: { all: { files: [ 'main/**/*.less', ], tasks: ['less'], options: { nospawn: true } } } }); grunt.loadnpmtasks('grunt-contrib-less'); grunt.loadnpmtasks('grunt-contrib-watch'); grunt.event.on('watch', function(action, filepath) { // handling .less imports when watch task // detects change in imported file, "the main .less file // import" compiled, instead of imported file. // naming convention imported files: title of main file // imports + "-" + name describing imported file // e.g. main.less, main-colors.less, main-structure.less, main-utility.less var splittedpath = filepath.split('/'); var filename = splittedpath[splittedpath.length - 1]; delete splittedpath[splittedpath.length - 1]; var filedirectorypath = splittedpath.join('/'); var splittedfilename = filename.split('-'); if (splittedfilename.length > 1){ filepath = filedirectorypath + splittedfilename[0] + '.less'; } grunt.config(['less', 'all', 'files'], [{ expand: true, src: filepath, ext: '.css', }]); }); grunt.registertask('default', ['watch']); };
all appreciated! thanks!
after research , on grunt-contrib-watch forum managed find answer question.
first of it's not possible without "grunt.event.on('watch'..." hack.
the way implement several files saved @ same time found here , easy implement: https://github.com/gruntjs/grunt-contrib-watch#compiling-files-as-needed
the result of updated code solving issue:
'usestrict'; module.exports = function (grunt) { grunt.initconfig({ globalconfig: globalconfig, less: { all: { files: 'event load filepaths on fly', options: { compress: false, } }, }, watch: { all: { files: ['main/**/*.less'], tasks: ['less'], options: { nospawn: true } } } }); grunt.loadnpmtasks('grunt-contrib-less'); grunt.loadnpmtasks('grunt-contrib-watch'); var changedfiles = object.create(null); var onchange = grunt.util._.debounce(function() { grunt.config(['less', 'all', 'files'], [{ expand: true, src: object.keys(changedfiles), ext: '.css', }]); changedfiles = object.create(null); }, 200); grunt.event.on('watch', function(action, filepath) { // handling .less imports when watch task // detects change in imported file main .less file // imports compiled instead of imported file. // naming convention imported files: // title of main file imports + "-" + name describing imported file var splittedpath = filepath.split('/'); var filename = splittedpath[splittedpath.length - 1]; delete splittedpath[splittedpath.length - 1]; var filedirectorypath = splittedpath.join('/'); var splittedfilename = filename.split('-'); if (splittedfilename.length > 1){ filepath = filedirectorypath + splittedfilename[0] + '.less'; } changedfiles[filepath] = action; onchange(); }); grunt.registertask('default', ['watch']); };