Gulp'ta Belge Değişikliklerini İzleme

Bir dönüşüm yapmak gerektiğinde her seferinde konsola komut yazmak pek kullanışlı değil - sonuçta kod yazarken bunu yapmak oldukça sık gerekiyor.

Bu nedenle Gulp'ta, dosya değişikliklerini izlemek için watch adında özel bir fonksiyon yerleşik olarak bulunur. İzlenen dosyalardan herhangi biri değiştiğinde, ilgili görev otomatik olarak başlatılacaktır.

LESS'i CSS'e dönüştürme örneği üzerinden inceleyelim. Öncelikle gerekli her şeyi içe aktaralım:

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

Şimdi dönüşüm için bir görev oluşturalım:

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

Şimdi, içinde dosya değişikliklerimizi izleyeceğimiz ve bu durumda görevimizi çağıracağımız anonim bir fonksiyonu dışa aktaralım:

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

Komut satırında çalıştırdıktan sonra "sonsuz" bir görev çalışacaktır. Bu, bu terminale başka komutlar yazılamayacağı anlamına gelir. Böyle bir görevin çalışmasını terminalde Ctrl + C tuş kombinasyonuna basarak durdurabilirsiniz.

Çeşitli dosya grupları izlenerek onlara çeşitli görevler atanabilir:

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

Veya bir grup için bir dizi görev çalıştırılabilir:

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

Elinizde bir grup JavaScript dosyası olduğunu varsayalım. Bu dosyaların tek bir dosyada birleştirilmesini ve ardından bu dosyanın küçültülmesi işleminin yapılmasını sağlayın. Dosyalarımızdan herhangi biri değiştiğinde bu görevin çalışmasını sağlayın.