Gulp-da fayllarni birlashtirish

CSS kodini yozishda uni bir nechta fayllarga bo'lish qulay. Biroq, fayllar qancha ko'p bo'lsa, sayt sahifasi shuncha sekin yuklanadi. Ma'lum bo'ladiki, kod yozishda bir nechta fayllarda ishlash qulay, lekin HTML-ga ulashda bu fayllarni bitta faylga birlashtirish kerak.

Bunda bizga gulp-concat maxsus plagini yordam beradi. Keling, uni loyihamizga o'rnatamiz: loyihamizga o'rnatamiz:

terminalnpm install gulp-concat --save-dev 

Shundan so'ng o'rnatilgan plaginni import qilamiz:

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

Keling, uning yordamida bir nechta CSS fayllarini bittaga jamlaymiz:

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

Birlashtirilgan fayl bilan amallar

Birlashtirilgandan so'ng, zanjir bo'ylab keyingi qadamda bitta birlashtirilgan fayl harakatlanadi va uning ustida turli xil amallarni bajarish mumkin.

Misol uchun, keling CSS ni minimallashtiramiz:

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