Search code examples
javascriptnode.jsgulpgulp-useref

Gulp. Gulp-If. How to call several plug-ins?


Please tell me how to implement the call several plug-ins for css.

gulp.task("useref", function() {
    return gulp.src("src/*.html")
        .pipe(useref())
        .pipe(gulpIf("*.js", uglify()))
        .pipe(gulpIf("*.css", combineMq(), cssnano())) // This does not work
        .pipe(gulp.dest("build"));
});

Error:

$ gulp useref
[20:21:12] Using gulpfile ~\Desktop\Gulp\gulpfile.js
[20:21:12] Starting 'useref'...

events.js:154
      throw er; // Unhandled 'error' event
      ^
 Error: D:\Users\Dmitry\Desktop\Gulp\index.html:1:1: Unknown word
<!DOCTYPE html>
^
<html lang="en">

Solution

  • You can use lazypipe:

    var lazypipe = require('lazypipe');
    
    gulp.task("useref", function() {
      var cssPipeline = lazypipe()
        .pipe(cssnano)
        .pipe(combineMq, {
          beautify: false
        });
    
      return gulp.src("src/*.html")
        .pipe(useref())
        .pipe(gulpIf("*.js", uglify()))
        .pipe(gulpIf("*.css", cssPipeline()))
        .pipe(gulp.dest("build"));
    });