Очистка папки перед сохранением в Gulp

Вы уже наверняка обратили внимание на то, что при сохранении файлов в папку, Gulp не удаляет из нее предыдущие файлы.

Чтобы это происходило, нужно установить специальный плагин del.

Установим его, выполнив следующую команду:

terminalnpm install del --save-dev

Данный плагин отличается от используемых нами ранее тем, что он используется вне цепочки методов pipe. Поэтому в данном случае мы должны создать группу задач: первая задача будет на очищение папки, а вторая будет делать полезную работу.

Пусть для примера в качестве полезной работы выберем минимизацию CSS.

Давайте подключим все необходимое:

javascriptlet {src, dest, series} = require('gulp');
let cleanCSS = require('gulp-clean-css');
let del = require('del');

Сделаем задачу на очищение папки dist:

javascriptfunction taskDel(cb) {
  return del('dist/*');
}

Сделаем задачу на минимизацию CSS:

javascriptfunction taskCss(cb) {
  return src('src/*.css')
    .pipe(cleanCSS())
    .pipe(dest('dist'));
}

Выполним серию задач:

javascriptexports.default = series(taskDel, taskCss);

Соберем все вместе и получим следующий код:

javascriptfunction taskDel(cb) {
  return del('dist/*');
}
function taskCss(cb) {
  return src('src/*.css')
    .pipe(cleanCSS())
    .pipe(dest('dist'));
}

exports.default = series(taskDel, taskCss);