Rensning av mapp innan sparande i Gulp

Du har säkert redan lagt märke till att när filer sparas i en mapp, så tar inte Gulp bort tidigare filer från den.

För att detta ska hända måste du installera ett speciellt tillägg del.

Låt oss installera det genom att köra följande kommando:

terminalnpm install del --save-dev

Detta tillägg skiljer sig från de vi använt tidigare genom att det används utanför kedjan av metoder pipe. Därför måste vi i det här fallet skapa en grupp av uppgifter: den första uppgiften kommer att rensa mappen, och den andra kommer att göra det användbara arbetet.

Låt oss för exemplets skull välja CSS-minifiering som det användbara arbetet.

Låt oss ansluta allt som behövs:

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

Låt oss skapa en uppgift för att rensa mappen dist:

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

Låt oss skapa en uppgift för CSS-minifiering:

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

Låt oss köra en serie uppgifter:

javascriptexports.default = series(taskDel, taskCss);

Låt oss samla allt och få följande kod:

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

exports.default = series(taskDel, taskCss);