Рад са фајловима у Gul-у

Gulp омогућава да се узме група фајлова, изврши одређена операција са том групом, а затим измењене фајлове постави на нову адресу.

За то су намењене специјалне функције src и dest. Хајде да за почетак увеземо их из наше библиотеке:

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

Функција src омогућава да се добије наведени фајл:

javascriptfunction task(cb) {
  return src('src/styles.css'); // return уместо позива cb
}

Са тим фајлом се затим може низом извршити разне операције уз помоћ функције pipe. Шематски то изгледа овако:

javascriptfunction task(cb) {
  return src('src/styles.css')
    .pipe(операција1)
    .pipe(операција2)
    .pipe(операција3)
}

Последњи позив pipe у низу се завршава функцијом dest, која задаје фасциклу у коју ће се послати резултат извршених операција:

javascriptfunction task(cb) {
  return src('src/styles.css')
    .pipe(операција1)
    .pipe(операција2)
    .pipe(операција3)
    .pipe(dest('dist')); // послаћемо у фасциклу dist
}

Свака операција извршава неку манипулацију са нашим фајлом. На пример, прво се може претворити LESS у CSS, затим додати префикси својствима CSS, па минимизовати добијени CSS и тако даље.

За сваку операцију је намењен одређени npm плугин за Gulp. Плугине је потребно инсталирати и повезати са нашим фајлом. Проучавањем различитих плугина бавићемо се у наредним лекцијама.

За сада, за загревање, хајде да узмемо наш фајл и пошаљемо његову копију у фасциклу dist, као да смо извршили неке операције над њим:

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

Низ путања до фајлова

Функција src као параметар може примити не један фајл, већ одједном неколико у виду низа:

javascriptfunction task(cb) {
  let files = [
    'src/styles1.css',
    'src/styles2.css'
  ];
  
  return src(files)
    .pipe(dest('dist'));
}