Failų sujungimas naudojant Gulp

Rašant CSS kodą, patogu jį suskirstyti į kelis failus. Tačiau, kuo daugiau failų, tuot lėčiau įsikels svetainės puslapis. Pasirodo, kad rašant kodą patogu dirbti su keliais failais, o prijungiant prie HTML, sujungti šiuos failus į vieną.

Tam mums padės specialus įskiepis gulp-concat. Įdiekime jį į mūsų projektą: į mūsų projektą:

terminalnpm install gulp-concat --save-dev 

Po to importuokime įdiegtą įskiepį:

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

Pabandykime su jo pagalba surinkti kelis CSS failus į vieną:

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

Operacijos su sujungtu failu

Po sujungimo toliau grandine judės vienas sujungtas failas ir su juo galima atlikti įvairias operacijas.

Pavyzdžiui, atlikime CSS minimizavimą:

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