30
Июл
2018

Стартовый шаблон Glivera-Team

Сегодня мы разберем наш стартовый шаблон, что где лежит и для чего. Для того чтобы запустить шаблон у себя локально открываем файл README.md(либо README-RUS.md) и выполняем необходимые пункты.

└──assets
	└── fonts/
		Шрифты проекта
	└── i/
		Изображения проекта
		└── icons/
			Иконки проекта. С иконок которые находятся в этой папке мы варим спрайт, который находится в следующей папке sprite
	└── js/
		Весь js проекта, код мы пишем в файле main.js
		└── all/
			Сюда кладем все плагины, для того чтобы подключить какой-то плагин достаточно его добавить в эту папку, после этого все ее содержимое конкатенируется в один файл
	└── pug/
		└── blocks/
			Здесь мы храним разные блоки которые потом инклюдим на страницы
		└── templates/
			_global_mixins.pug - здесь идет подключение стилей, скриптов, также в этом файле находятся глобальные миксины которые используются от проекта к проекту, например для пагинации, меню и т.д
			_project_mixins.pug - здесь пишем миксины для текущего проекта
			_project_var.pug - здесь пишем переменные для текущего проекта
	_layout.pug - является сборщиком pug файлов + определяет структуру страниц
	index.pug - index страница
	└── sass/
		└── blocks/
			Хранятся стили для разных блоков
		└── helpers/
			_buttons_extends.scss - хранятся экстенды для всех кнопок на проекте
			_extends.scss - набор экстендов которые используются от проекта к проекту
			_helpers_all.scss - хранит в себе подключение всех scss файлов из папки helpers
			_mixin.scss - набор миксинов которые используются от проекта к проекту
			_project_extends.scss - экстенды для текущего проекта
			_variables.scss - хранятся все переменные, как глобальные так и которые нужны на текущем проекте
		└── plugins/
			Стили для плагинов
		└── templates/
			Шаблон для спрайтов
		_base.scss - здесь описываются базовые стили, для html, body и для каких-то глобальных блоков
		_family.scss - миксины которые помогают управлять стилями для :nth-child элементов
		_fonts.scss - здесь подключаем шрифты
		_footer.scss - стили для футера
		_forms.scss - стили для форм
		_header.scss - стили для хедера
		_includes.scss - файл сборщик, собирает все зависимости в один файл
		_main.scss - здесь основные стили
		_reset.scss - сброс стилей
		_icons.scss - стили иконок которые генерируются после создание спрайта
		_main_global.scss - файл в который попадает весь scss код
└──helpers
	Здесь хранятся готовые куски кода определенных компонентов
└──plugins
	Папка  содержит плагины которые мы часто используем при разработке
Share

Тебе может это понравится...