Gulp-less ne fait plus de fichiers CSS

Question

J'utilise gulp pour générer du CSS à partir de MOINS. Cela a fonctionné parfaitement, mais maintenant le script semble ignorer les fichiers LESS.

Voici mon gulpfile.js (il est certainement correct, puisque je change pas dans la dernière fois):

// Include Gulp plugins 
var gulp = require('gulp'), 
    less = require('gulp-less'), 
    watch = require('gulp-watch'), 
    prefix = require('gulp-autoprefixer'), 
    plumber = require('gulp-plumber'), 
    filter = require('gulp-filter'), 
    rename = require('gulp-rename'), 
    path = require('path') 
; 
// Compile LESS to CSS 
gulp.task('build-less', function() { 
    const fileFilter = filter(['*', '!mixins.less', '!variables.less']); 
    gulp.src('./public/less/*.less') // path to less file 
     .pipe(fileFilter) 
     .pipe(plumber()) 
     .pipe(less()) 
     .pipe(gulp.dest('./public/css/')) // path to css directory 
    ; 
}); 
// Get vendors' code 
gulp.task('build-vendors', function() { 
    gulp.src(['./public/components/bootstrap/less/theme.less', './public/components/bootstrap/less/bootstrap.less']) // path to less file 
     .pipe(plumber()) 
     .pipe(less()) 
     .pipe(rename(function (path) { 
      //rename all files except 'bootstrap.css' 
      if (path.basename + path.extname !== 'bootstrap.css') { 
       path.basename = 'bootstrap-' + path.basename; 
      } 
     })) 
     .pipe(gulp.dest('./public/css')) // path to css directory 
    ; 
}); 
// Run the build process 
gulp.task('run', ['build-less', 'build-vendors']); 
// Watch all LESS files, then run build-less 
gulp.task('watch', function() { 
    gulp.watch('public/less/*.less', ['run']) 
}); 
// Default will run the 'entry' task 
gulp.task('default', ['watch', 'run']); 

Et voici l'appel et la sortie:

$ gulp 
[11:21:03] Using gulpfile /var/www/path/to/project/gulpfile.js 
[11:21:03] Starting 'watch'... 
[11:21:03] Finished 'watch' after 21 ms 
[11:21:03] Starting 'build-less'... 
[11:21:03] Finished 'build-less' after 13 ms 
[11:21:03] Starting 'build-vendors'... 
[11:21:03] Finished 'build-vendors' after 4.65 ms 
[11:21:03] Starting 'run'... 
[11:21:03] Finished 'run' after 5.37 μs 
[11:21:03] Starting 'default'... 
[11:21:03] Finished 'default' after 6.05 μs 

Le whatch fonctionne également correctement - quand j'édite mes fichiers MOINS j'obtiens une sortie comme ceci:

[11:22:22] Starting 'build-less'... 
[11:22:22] Finished 'build-less' after 1.96 ms 
[11:22:22] Starting 'build-vendors'... 
[11:22:22] Finished 'build-vendors' after 1.78 ms 
[11:22:22] Starting 'run'... 
[11:22:22] Finished 'run' after 5.08 μs 

J'ai essayé aussi d'exécuter le build-less directement:

$ gulp build-less 
[11:24:06] Using gulpfile /var/www/path/to/project/gulpfile.js 
[11:24:06] Starting 'build-less'... 
[11:24:06] Finished 'build-less' after 13 ms 

Aucune erreur, mais aussi aucun changement au niveau des fichiers CSS.

Qu'est-ce qui pourrait mal tourner ici et comment y remédier?

Answer 1

gulp-filter utilise multimatch pour faire correspondre les chemins de fichiers avec les motifs globaux. La documentation pour multimatchhas this to say about *:

* correspond à un nombre de caractères, mais pas /

Depuis que vous essayez de faire correspondre les fichiers avec des chemins comme public/less/foo.less (qui contiennent un /) en utilisant un seul astérisque * ne fonctionne pas. Vous devez utiliser deux astérisques **:

gulp.task('build-less', function() { 
    const fileFilter = filter(['**/*', '!**/mixins.less', '!**/variables.less']); 
    gulp.src('./public/less/*.less') // path to less file 
    .pipe(fileFilter) 
    .pipe(plumber()) 
    .pipe(less()) 
    .pipe(gulp.dest('./public/css/')); // path to css directory 
});