Failų pakeitimų stebėjimas naudojant Gulp

Ne itin patogu kiekvieną kartą konsoleje vykdyti komandą, kai reikia atlikti kokią nors transformaciją - juk kurdami kodą tai tenka daryti labai dažnai.

Todėl Gulp yra įdiegta speciali funkcija watch failų pakeitimų stebėjimui. Pakeitus bet kurį iš stebimų failų, atitinkama užduotis bus paleista automatiškai.

Pažiūrėkime į pavyzdį, kaip transformuoti LESS į CSS. Pirmiausia prijunkime viską, ko reikia:

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

Dabar sukurkime transformavimo užduotį:

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

Dabar eksportuokime anoniminę funkciją, kurios viduje stebėsime pakeitimus mūsų failuose, šiuo atveju iškeldami mūsų užduotį:

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

Paleidus komandinėje eilutėje suksis "amžina" užduotis. Tai reiškia, kad į šį terminalą negalėsime įvesti kitų komandų. Nutraukti tokios užduoties vykdymą galima terminale paspaudus derinį Ctrl + C.

Galima stebėti įvairias failų grupes, priskirdami jiems skirtingas užduotis:

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

O vienai grupei galima vykdyti užduočių seriją:

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