A dokumentumváltozások megfigyelése Gulp-ban
Nem túl kényelmes minden alkalommal a konzolban futtatni egy parancsot, amikor valamilyen átalakítást kell végezni - hiszen a kódírás során ezt nagyon gyakran kell megtenni.
Ezért a Gulp beépített watch funkcióval rendelkezik a fájlok változásainak figyelésére. Amikor bármelyik figyelt fájl megváltozik, a megfelelő feladat automatikusan elindul.
Nézzünk egy példát a LESS CSS-sé alakítására. Először is importáljuk mind a szükségeset:
let {src, dest, watch} = require('gulp');
let less = require('gulp-less');
Most készítsünk egy feladatot az átalakításra:
function task(cb) {
return src('src/*.less')
.pipe(less())
.pipe(dest('dist'));
}
Most exportáljunk egy anonim függvényt, amelyen belül figyeljük a fájljaink változásait, meghívva ebben az esetben a feladatunkat:
exports.default = function() {
watch('src/*.less', task);
};
A futtatás után a parancssorban egy "örök" feladat fog futni. Ez azt jelenti, hogy ebbe a terminálba nem lehet más parancsokat beírni. Egy ilyen feladat végrehajtását a terminálban a Ctrl + C billentyűkombináció megnyomásával szakíthatja meg.
Különböző fájlcsoportokat lehet figyelni, és különböző feladatokat rendelni hozzájuk:
exports.default = function() {
watch('src/*.less', task1);
watch('src/*.sass', task1);
};
Vagy egy csoporthoz egy feladatsorozatot is futtathat:
exports.default = function() {
watch('src/*.less', series(task1, task2));
};
Tegyük fel, hogy van egy JavaScript fájlcsoportja. Állítsa be úgy, hogy ezek a fájlok egyesüljenek egy fájlba, majd az a fájl minifikálódjon. Állítsa be úgy, hogy a feladat akkor fusson le, amikor bármelyik fájlunk megváltozik.