gulpgulp-clean-css

run gulp-clean-css options in gulp-inline


How do I go about configuring options for a nested plugin in gulp? I have a gulp task that uses gulp-inline to inline any css and js.

gulp-inline has options to set a css processor

gulp.task('html', function () {

  gulp.src(source + '**/*.+(html|php)')
    .pipe($.plumber())
    .pipe($.inline({
        base: source,
        js: $.uglify,
        css: $.cleanCss,
        disabledTypes: ['svg', 'img']
    }))
    .pipe(gulp.dest(build))
});

Ideally when running the task I'd like to declare config options for the css and js

gulp.task('html', function () {

  gulp.src(source + '**/*.+(html|php)')
    .pipe($.plumber())
    .pipe($.inline({
        base: source,
        js: $.uglify,
        css: $.cleanCss({
            keepBreaks: false,
            advanced: false,
            keepSpecialComments: '*',
            aggressiveMerging: false
        }),
        disabledTypes: ['svg', 'img']
    }))
    .pipe(gulp.dest(build))
});

Solution

  • Simply pass a function that returns the cleanCss transform:

    gulp.task('html', function () {
      gulp.src(source + '**/*.+(html|php)')
        .pipe($.plumber())
        .pipe($.inline({
            base: source,
            js: $.uglify,
            css: function() {
              return $.cleanCss({ /* options */ });
            },
            disabledTypes: ['svg', 'img']
        }))
        .pipe(gulp.dest(build))
    });