Набљудување на промени на документи во 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 датотеки. Направете така што овие датотеки ќе се спојат во една датотека, а потоа да се изврши минимизација на таа датотека. Направете така што задачата ќе се извршува при промена на која било од нашите датотеки.