Kuunganisha Faili katika Gulp

Wakati wa kuandaa msimbo CSS, ni rahisi kuugawa katika faili kadhaa. Hata hivyo, kadiri faili zinavyozidi, ndivyo ukurasa wa tovuti unavyochukua muda mrefu zaidi kupakia. Inabadilika kuwa, wakati wa kuandaa msimbo, ni rahisi kufanya kazi katika faili nyingi, lakini wakati wa kuunganisha kwa HTML, mchanganyiko wa faili hizi umoja.

Hii itatusaidia na programu-jalizi maalum gulp-concat. Wacha tuuisakinishe kwenye mradi wetu: kwenye mradi wetu:

npm install gulp-concat --save-dev

Baada ya hayo, tunalinganisha programu-jalizi iliyosakiniswa:

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

Wacha tuitumie kuikusanya faili kadhaa za CSS kuwa faili moja:

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

Unganisha faili kadhaa za JavaScript kuwa faili moja.

Uendeshaji na Faili Iliyounganishwa

Baada ya kuunganisha, mnyororo zaidi utasogea faili moja iliyounganishwa na juu yake inawezekana kufanya shughuli mbalimbali.

Kwa mfano, wacha tufanye uoptimeshaji wa CSS:

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

Unganisha faili kadhaa za LESS kuwa faili moja, kisha ubadilishe faili hii kuwa CSS, kisha ufanye uoptimeshaji wa CSS uliopatikana.