Rensing av mappen før lagring i Gulp

Du har sikkert allerede lagt merke til at når filer lagres i en mappe, sletter ikke Gulp tidligere filer fra den.

For at dette skal skje, må du installere en spesiell plugin kalt del.

La oss installere den ved å kjøre følgende kommando:

npm install del --save-dev

Denne pluginen skiller seg fra de vi har brukt tidligere ved at den brukes utenfor kjeden av pipe-metoder. Derfor må vi i dette tilfellet opprette en gruppe oppgaver: den første oppgaven vil være for å rense mappen, og den andre vil gjøre nyttig arbeid.

La oss for eksempel velge minifisering av CSS som det nyttige arbeidet.

La oss koble til alt som trengs:

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

La oss lage en oppgave for å rense mappen dist:

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

La oss lage en oppgave for minifisering av CSS:

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

La oss kjøre en serie med oppgaver:

exports.default = series(taskDel, taskCss);

La oss sette alt sammen og få følgende kode:

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

exports.default = series(taskDel, taskCss);

Lag en oppgave for minifisering av JavaScript. Rens mappen før hver kjøring av oppgaven.

Lag en gruppe med tre oppgaver: en oppgave for å rense mappen, en oppgave for minifisering av CSS og en oppgave for minifisering av JavaScript. Bestem hvilke oppgaver som skal utføres sekvensielt, og hvilke som skal utføres parallelt.