siteconveyer

SiteConveyer - a rapid site creation tool

Usage no npm install needed!

<script type="module">
  import siteconveyer from 'https://cdn.skypack.dev/siteconveyer';
</script>

README

SiteConveyer by RemRyahirev

Описание

Репозиторий-шаблон для вёрстки с использованием Stylus, Handlebars и ES6. Призван помочь быстро начать верстать любой проект в удобной среде с автообновлением через browser-sync.

Установка

Общее

  1. Нужно склонировать текущий репозиторий
  2. Установить Git-клиент
  3. Установить Node.js
  4. Установить yarn командой npm i -g yarn или любым другим способом из руководства
  5. Проверить установку командой yarn --version, иначе проверить системную переменную PATH
  6. Установить WebStorm
  7. В корневой папке выполнить yarn
  8. В корневой папке выполнить yarn make

Команды

  1. Для инициализации репозитория выполнить yarn make
  2. Для запуска в корневой папке выполнить yarn dev
  3. Для сборки выполнить yarn build
  4. Для деплоя выполнить yarn deploy
Внимание! Деплой пока делается только через git или folder (в конкретную папку)!
Не забудьте изменить путь до репозитория/папки в /.dev/deploy.json

Принцип работы

Структура папок

  1. src - исходные файлы
  2. src/css - Stylus
  3. src/css/vendor - стили сторонних библиотек
  4. src/html - HTML-компоненты для страниц
  5. src/html/data - data
  6. src/html/helpers - Handlebars helpers
  7. src/html/partials - Handlebars partials
  8. src/html/decorators - Handlebars decorators
  9. src/img - images
  10. src/js - es6
  11. src/js/vendor - скрипты сторонних библиотек
  12. src/static - вся папка со всеми подпапками попадает в сборку без изменений
  13. dist - сюда складываются dev-версия сайта для работы
  14. dist/ - сюда складываются готовые шаблоны (с подставленными компонентами)
  15. dist/css - собранные файлы стилей
  16. dist/img - images
  17. dist/js - js
  18. build - сюда складываются production-сборка
  19. .dev - здесь находятся системные файлы для работы SiteConveyer
  20. .dev/deploy.json - это файл с настройкой куда производить deploy

Основной процесс

После запуска порождается процесс, который следит за содержимым папки /src. В случае обнаружения изменения в этой папке запускаются сборщики страниц, стилей, картинок и скриптов, происходит обновление папки /dist.

При пересборке страниц, картинок и скриптов происходит перезагрузка страницы в браузере, в то время как при пересборке стилей файл стилей заменяется на странице прямо на лету.

Disclaimer

За корявость написанного никакой ответственности нет. Продукт поставляется по принципу as-is.