Fayllarin Gulp-də Birləşdirilməsi

CSS kodunu yazarkən onu bir neçə fayla bölmək rahatdır. Lakin, nə qədər çox fayl olsa, sayt səhifəsi bir o qədər yavaş yüklənəcək. Belə çıxır ki, kod yazarkən bir neçə faylla işləmək rahatdır, amma HTML-ə qoşarkən bu faylları bir yerə birləşdirmək lazımdır.

Bunda bizə xüsusi plagın gulp-concat kömək edəcək. Gəlin onu layihəmizə quraq: layihəmizə quraq:

npm install gulp-concat --save-dev

Bundan sonra quraşdırılmış plagini import edək:

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

Gəlin onun vasitəsilə bir neçə CSS faylını bir yerə yığaq:

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

Bir neçə JavaScript faylını bir faylda birləşdirin.

Birləşdirilmiş fayl üzərində əməliyyatlar

Birləşdirmədən sonra zəncir boyu daha irəli tək bir birləşdirilmiş fayl hərəkət edəcək və onun üzərində müxtəlif əməliyyatlar yerinə yetirilə bilər.

Nümunə üçün gəlin CSS-i minimize edək:

function task(cb) {
	return src('src/*.css')
		.pipe(concat('bundle.css'))
		.pipe(cleanCSS())
		.pipe(dest('dist'));
}

Bir neçə LESS faylını bir faylda birləşdirin, sonra həmin faylı CSS-ə çevirin, sonra alınan CSS-i minimize edin.