Kansioiden puhdistaminen ennen tallennusta Gulpissa

Olet varmasti jo huomannut, että tallennettaessa tiedostoja kansioon, Gulp ei poista siitä aiemmin tallennettuja tiedostoja.

Jotta tämä tapahtuisi, on asennettava erityinen laajennus del.

Asennetaan se suorittamalla seuraava komento:

npm install del --save-dev

Tämä laajennus eroaa aiemmin käyttämistämme sillä, että sitä käytetään pipe-metodiketjun ulkopuolella. Siksi tässä tapauksessa meidän on luotava tehtäväryhmä: ensimmäinen tehtävä puhdistaa kansion ja toinen tekee hyödyllisen työn.

Valitaan esimerkiksi hyödylliseksi työksi CSS:n minimoinnin.

Yhdistetään kaikki tarvittava:

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

Tehdään tehtävä dist-kansion puhdistamiseksi:

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

Tehdään tehtävä CSS:n minimoimiseksi:

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

Suoritetaan sarja tehtäviä:

exports.default = series(taskDel, taskCss);

Kootaan kaikki yhteen ja saadaan seuraava koodi:

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

exports.default = series(taskDel, taskCss);

Tee tehtävä JavaScriptin minimoimiseksi. Puhdista kansio ennen jokaisen tehtävän käynnistystä.

Tee kolmen tehtävän ryhmä: tehtävä kansion puhdistamiseksi, tehtävä CSS:n minimoimiseksi ja tehtävä JavaScriptin minimoimiseksi. Määritä, minkä tehtävien tulee suorittua peräkkäin ja mitkä - rinnakkain.