Посматрање промена докумената у Gulp-у

Није баш погодно сваки пут ручно покретати команду у конзоли када је потребно извршити неку трансформацију – јер се током писања кода то мора чинити веома често.

Због тога у Gulp постоји уграђена посебна функција watch за посматрање промена на фајловима. При промени било ког од праћених фајлова одговарајући задатак ће бити аутоматски покренут.

Хајде да погледамо пример трансформације LESS-а у CSS. За почетак, хајде да укључимо све што је потребно:

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

Сада направимо задатак за трансформацију:

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

Сада ћемо извезти анонимну функцију, унутар које ћемо пратити промене наших фајлова, позивајући у том случају наш задатак:

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

Након покретања, у командном реду ће се окретати "вечни" задатак. То значи да се у овај терминал неће моћи уносити друге команде. Извршавање таквог задатка може се прекинути притиском на комбинацију Ctrl + C у терминалу.

Могуће је пратити различите групе фајлова, везујући за њих различите задатке:

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

А може се за једну групу извршити серија задатака:

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

Нека постоји група JavaScript фајлова. Направите тако да се ови фајлови споје у један фајл, а затим изврши минимизација тог фајла. Направите тако да се задатак извршава при промени било ког од наших фајлова.