Pulizia della cartella prima del salvataggio in Gulp

Probabilmente hai già notato che, quando i file vengono salvati in una cartella, Gulp non cancella i file precedenti da essa.

Per fare in modo che ciò accada, è necessario installare un plugin speciale del.

Installiamolo eseguendo il seguente comando:

npm install del --save-dev

Questo plugin differisce da quelli usati in precedenza in quanto viene utilizzato al di fuori della catena dei metodi pipe. Pertanto, in questo caso dobbiamo creare un gruppo di task: il primo task si occuperà di pulire la cartella, mentre il secondo farà il lavoro utile.

Per esempio, come lavoro utile scegliamo la minimizzazione del CSS.

Colleghiamo tutto il necessario:

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

Creiamo un task per pulire la cartella dist:

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

Creiamo un task per la minimizzazione del CSS:

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

Eseguiamo una serie di task:

exports.default = series(taskDel, taskCss);

Mettiamo tutto insieme e otteniamo il seguente codice:

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

exports.default = series(taskDel, taskCss);

Crea un task per la minimizzazione del JavaScript. Pulisci la cartella prima di ogni esecuzione del task.

Crea un gruppo di tre task: un task per pulire la cartella, un task per la minimizzazione del CSS e un task per la minimizzazione del JavaScript. Determina quali task devono essere eseguiti in sequenza, e quali - in parallelo.