/pug-scss-js_start-template

Стартовый шаблон для верстки, с использованием Pug-шаблонизатора, SASS-препроцессора и js.

Primary LanguageJavaScript

Стартовый шаблон для верстки

Стартовый шаблон для верстки, с использованием Pug-шаблонизатора, SASS-препроцессора и js.

Сборка осуществляется с помощью Gulp


Структура:

  • dev/.. - Рабочая директория
    • assets/.. - Директория с обработанными файлами, всеми изображениями, спрайтами, а также шрифтами
    • pug/.. - Директория с pug-файлами
    • scripts/.. - Директория со всеми скриптами проекта
    • styles/.. - Директория с файлами стилей проекта в формате ".scss"
    • .htaccess - Конфигурационный файл веб-сервера
    • index.html - Стартовая страница
  • prod/.. - Директория с подготовленными на production файлами
  • .csscomb.json - Файл с конфигурацией плагина СSSComb
  • gulpfile.js - Файл с конфигурацией Gulp
  • package.json - Файл с информацией о проекте и всех использованных зависимостях

Gulp задачи (таски):

Основные:

  • gulp: Запуск задачи по-умолчанию. По-умолчанию запускает "prepare" и "server"
  • gulp build: Сборка проекта. Последовательно выполняет "clean", "sprite", "img" и "replace";
  • gulp deploy: Выгрузка файлов по ftp на сервер ;
  • gulp zip: Архивация иректории с подготовленными на production файлами;
  • gulp zipall: Архивация проекта целиком;

Вспомогательные:

  • gulp server: Запуск browserSync, и слежения за изменениями в файлах;
  • gulp img: Обработка изображений и перенос их из development-папки в production;
  • gulp sprite: Генерация спрайта;
  • gulp html: Преобразование pug-файлов в html-файлы;
  • gulp css: Преобразование scss-файорв в css c оптимизацией и минификацией;
  • gulp js: Задача для объединения и минификации JS-файлов;
  • gulp clearcache: Очистка кэша;
  • gulp clean: Очистка папки "prod/" путем удаления их нее всех файлов;
  • gulp prepare: Подготовка структуры;
  • gulp replace: Перенос html,css,js,шрифтов и остальных необходимых файлов в директорию "prod/";