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

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

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

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

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

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

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

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

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

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

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

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

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

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