Документація до збірки на основі Vite

Цей документ описує налаштування та структуру збірки для проєкту, заснованого на Vite.

Основні команди

yarn d        - запуск сервера для розробки.

yarn b        - білд проєкту.

yarn p        - перегляд білду на сервері.

yarn f        - генерація іконочного шрифту та конвертація шрифтів.

yarn i        - генерація тільки іконочного шрифту.

yarn a        - генерація аліасів.

yarn php      - запуск сервера PHP.

yarn coffee   - компіляція CoffeeScript.

Аліаси (скорочення) шляхів

@h/   - /src/html/

@c/   - /src/html/components/

@o/   - /src/html/other/

@ui/  - /src/html/components/UI/

@j/   - /src/js/

@s/   - /src/scss/

@i/   - /src/assets/img/

@f/   - /src/assets/files/

@v/   - ./src/assets/video/

@tw/  - ./src/tw_css/

Основні папки проєкту

public/        - папка для розміщення статичних файлів.

src/           - основна директорія для розробки.

src/data       - json файли з данними для компонента.

src/assets/    - зберігання файлів, зображень, шрифтів та відео.

src/html/      - шаблони HTML.

src/pages/     - сторінки сайту.

Основні команди

snippets.json        — містить рекомендовані сніпети для роботи з шаблоном.

template.config.js   — файл налаштувань шаблону.

Шрифти та іконки

Для шрифтів та іконок використовується папка fonts-convert/:

Шрифти у форматі ttf розміщуються в корені папки fonts-convert/.
SVG-іконки для генерації шрифту — у fonts-convert/icons/.

Процес генерування шрифтів створює файли шрифтів у форматі woff2 в папці src/assets/fonts/, а також генерує файли fonts.scss та icons.scss у src/scss/fonts/ з класами для шрифтів та іконок. Додаткові матеріали для іконок (оптимізовані SVG, шпаргалка по іконках) — у plugins/ifont-gen/dist/.