Это простая сборка для статичных сайтов. Сделано только для своих нужд. Если обнаружите, какие-то баги или предложения по улучшению сборки пишите мне на почту - endrameda98@gmail.com буду очень рад и с радостью рассмотрю ваши письма.
Для работы со сборщиком необходимо установить nodejs без него не получиться работать.
npm install
npm ci
Сборка для разработки
npm run dev
Сборка для разработки с запуском локального сервера
npm run start
Сборка для продакшена
npm run build
Помимо этого вы можете сами добавить какие либо настройки для запуска webpack. Подробнее об этом можете узнать на сайте https://webpack.js.org/
В проекте присутствует ESlint, Прописаны скрипты для исправления ошибок этих инструментов, чтобы вы не правили все в ручную.
npm run eslint
Все эти команды для npm прописаны в файле package.json
Для работы с Javscript используется Babel Вы можете смело писать в современном стандарте, и весь код будет переведен на старый чтобы работал на всех браузерах. Но бывает вам нужно, установить какие-то дополнительные Полифиллы чтобы все работало корректно. По умолчанию не все что есть в новом стандарте переводиться на старый. Так как если полифиллов много, то и код JS на выходе будет большой.
В данной сборке используется только SCSS нет даже обычного css его можете писать напрямую в scss файлах. Используется postcss И некоторые плагины из него. К стилям автоматически будут проставляться префиксы для разных браузеров. Все медиа запросы по умолчанию переносятся в конец файла стилей и объединяются, это позволяет значительно уменьшить размер файлов. Помимо всего этого некоторые свойства px при компиляции заменяются на rem это помогает писать меньше кода для адаптации. Подробнее об этих свойствах можете посмотреть в файле postcss.config.js
В сборке для разработки используются карта исходников. Благодаря этому вы можете легко делать отладку вашего кода в режиме разработки.
При сборке на Продакшен у вас все стили скрипты картинки будут минифицированы, это очень сильно уменьшает размеры выходных файлов. Еще для скриптов создаются файл Vendors объеденяет все библиотеки, полифиллы которые подключены на ваш сайт или приложения. Это очень удобно так как при первой загрузке они загружаются, а на последующих они не загрузятся повторно, а загружаются только скрипты которые вы пишете.
В сборщике используется шаблонизатор EJS с ejs-compiled-loader так что некоторые функции инклюды могут отличаться от нативного ejs пока решения для этой проблемы не нашел =)