Полный цикл в digital

Объединение файлов Gulp

При написании CSS кода удобно разбивать его на несколько файлов. Однако, чем больше файлов, тем медленнее будет грузится страница сайта. Получается, что при написании кода удобно работать в нескольких файлах, а при подключении к HTML слить эти файлы в один.

В этом нам поможет специальный плагин gulp-concat, давайте установим в наш проект:

npm install gulp-concat --save-dev

После этого импортируем установленный плагин:

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

Давайте с его помощью соберем несколько CSS файлов в один:

gulpfile.jsfunction task(cb) {
  return src("src/*.css").pipe(concat("bundle.css")).pipe(dest("dist"));
}

Операции с объединенным файлом

После объединения по цепочке дальше будет двигаться один объединенный файл и над ним можно будет выполнять различные операции. Для примера давайте выполним минимизацию CSS:

gulpfile.jsfunction task(cb) {
  return src("src/*.css").pipe(concat("bundle.css")).pipe(cleanCSS()).pipe(dest("dist"));
}
Заполните форму уже сегодня!
Для начала сотрудничества необходимо заполнить заявку или заказать обратный звонок. В ответ получите коммерческое предложение, которое будет содержать индивидуальную стратегию с учетом требований и поставленных задач
Работаем по будням с 9:00 до 18:00. Заявки, отправленные в выходные, обрабатываем в первый рабочий день до 12:00.
Спасибо, ваш запрос принят и будет обработан!
Эйч Маркетинг