Opazovanje sprememb dokumentov v Gulp

Ni zelo priročno vsakič klicati ukaz v konzoli ob potrebi po izvedbi kakšne transformacije - saj pri pisanju koda to moramo narediti zelo pogosto.

Zato ima Gulp vgrajeno posebno funkcijo watch za opazovanje sprememb datotek. Ob spremembi katere koli od sledenih datotek bo ustrezna naloga zagnana avtomatično.

Poglejmo si na primeru transformacije LESS v CSS. Za začetek priklopimo vse potrebno:

let {src, dest, watch} = require('gulp');
let less = require('gulp-less');

Zdaj naredimo nalogo za transformacijo:

function task(cb) {
	return src('src/*.less')
		.pipe(less())
		.pipe(dest('dist'));
}

Zdaj izvedemo izvoz anonimne funkcije, znotraj katere bomo sledili spremembam naših datotek, pri čemer kličemo v tem primeru našo nalogo:

exports.default = function() {
	watch('src/*.less', task);
};

Po zagonu se bo v ukazni vrstici vrtela "večna" naloga. To pomeni, da v ta terminal ne bomo mogli vnašati drugih ukazov. Prekiniti izvajanje takšne naloge je mogoče s pritiskom na terminalu kombinacijo Ctrl + C.

Lahko sledimo različnim skupinam datotek, jih povezujemo z različnimi nalogami:

exports.default = function() {
	watch('src/*.less', task1);
	watch('src/*.sass', task1);
};

Ali pa lahko za eno skupino izvedemo serijo nalog:

exports.default = function() {
	watch('src/*.less', series(task1, task2));
};

Recimo, da imate skupino JavaScript datotek. Poskrbite, da se te datoteke združijo v eno datoteko, nato pa se izvede minimizacija te datoteke. Poskrbite, da se naloga izvede ob spremembi katere koli od naših datotek.