Gulpda hujjatlarning o'zgarishini kuzatish

Har safar qandaydir o'zgartirishni amalga oshirish uchun konsolga buyruq kiritish unchalik qulay emas - axir kod yozishda buni juda tez-tez qilishga to'g'ri keladi.

Shuning uchun Gulp'da fayllarning o'zgarishini kuzatish uchun maxsus watch funksiyasi mavjud. Kuzatilayotgan fayllarning har qanday o'zgarishida mos vazifa avtomatik ravishda ishga tushadi.

Keling, LESS ni CSS ga o'zgartirish misolida ko'rib chiqaylik. Boshlash uchun kerakli narsalarning hammasini ulaymiz:

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

Endi o'zgartirish vazifasini yaratamiz:

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

Endi anonim funksiyani eksport qilaylik, uning ichida fayllarimizdagi o'zgarishlarni kuzatib boramiz, bu holda vazifamizni chaqiramiz:

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

Ishga tushirilgandan so'ng, komanda satrida "abadiy" vazifa aylanib turadi. Bu shuni anglatadiki, boshqa buyruqlarni ushbu terminalga kiritib bo'lmaydi. Bunday vazifani bajarishni terminalda Ctrl + C kombinatsiyasini bosib to'xtatishingiz mumkin.

Turli fayl guruhlarini kuzatib, ularga turli vazifalarni bog'lash mumkin:

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

Yoki bitta guruh uchun bir qator vazifalarni bajarish mumkin:

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

Faraz qilaylik, sizda JavaScript fayllar guruhi bor. Ushbu fayllar bitta faylga birlashtirilishi va keyin ushbu faylning minimallashtirilishi bajariladigan qiling. Fayllarimizning har qanday o'zgarishida vazifa bajariladigan qiling.