Минификация и сжатие HTML в GULP 4

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

Подключаемые пакеты:

var gulp         = require('gulp'),
    htmlmin      = require('gulp-htmlmin');

Задача на сжатие файлов .html:

// Optimize HTML
gulp.task('minify-html', function() {
  return gulp.src('app/**/*.html') // указываем пути к файлам .html
  .pipe(htmlmin({
    collapseWhitespace: true, // удаляем все переносы
    removeComments: true // удаляем все комментарии
  }))
  .pipe(gulp.dest('dist')); // оптимизированные файлы .html переносим на продакшен
});
Создание и использование Source Maps для css и js в GULP 4

Хотелось бы в двух словах рассказать, как настроить Source Maps для GULP 4, но не…

Создание спрайтов в GULP 4 с поддержкой Retina

Для оптимизации запросов на сервер можно объединить иконки и небольшие картинки, которые используются в css,…

Как оптимизировать и максимально сжать изображения в GULP 4 с помощью gulp-imagemin

В общем, перепробовал десятки разных плагинов и настроек, но .jpg совсем не оптимизировались, а иногда…

Бесконечный анимированный фон с эффектом параллакса

Бесконечный анимированный фон с эффектом параллакса создан на основе варианта 2 из этой статьи HTML…

3 комментария

Александр

Нельзя ли об этом поподробнее для чайника? И где этот код размещать?

Ответить