Назіранне за змяненнем дакументаў у 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));
};