pure-mate

Pure Mate — Vite сборка

Инструкция по запуску, структуре и управлению текущей сборкой.

📦 Требования

Перед началом убедись, что установлено:

Node.js версии 18+ (рекомендуется LTS)
npm (идёт вместе с Node.js)
Git (для работы с репозиторием)

Проверка:

node -v
npm -v

🚀 Быстрый старт

# Установка зависимостей
npm install

# Запуск в режиме разработки
npm run dev

📜 Основные команды

Команда	Назначение
`npm run dev`	Локальная разработка
`npm run online`	Dev-сервер, доступный в сети
`npm run build`	Production-сборка
`npm run preview`	Предпросмотр build
`npm run zip`	Сборка + архив
`npm run tmp`	Временная сборка + zip
`npm run deploy`	Деплой по FTP
`npm run git`	Сборка + публикация через Git
`npm run stat`	Статистика проекта
`npm run stat-clear`	Очистка статистики
`npm run add`	Создание нового компонента

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

src/
├── assets/            # Изображения, иконки, шрифты
├── components/
│   ├── pages/         # Контент страниц
│   ├── layout/        # Header, Footer, Menu, UI-компоненты
│   ├── forms/         # Формы
│   └── effects/       # JS-эффекты и интерактив
├── styles/            # Глобальные стили (SCSS / CSS)

template_modules/     # Основной функционал сборки

template.config.js    # Конфигурация template_modules

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

Vite используется как сборщик
Поддерживаются HTML / Pug / Nunjucks
JS — модульный, ES Modules
SCSS + PostCSS
Подключение React / Vue при необходимости

Компонентный подход: логика, стили и шаблоны разделены.

⚙️ Конфигурация сборки

`template.config.js`

Через этот файл управляется функционал из папки template_modules:

оптимизация изображений
генерация шрифтов
SVG-спрайты
статистика
режимы сборки

Изменения в конфиге напрямую влияют на поведение сборки.

➕ Создание компонентов

npm run add

Скрипт создаёт структуру компонента и подключает его автоматически.

🧪 Production сборка

npm run build

Результат появится в папке dist/.

❗ Важно

Не правь файлы внутри template_modules, если не понимаешь последствия
Все кастомные стили — только через src/styles
Логику страниц держи в components/pages

🛠 Используемые технологии

Html, Scss, JavaScript, Vite, Gulp, Webpack
Tailwind (опционально)
React / Vue (опционально)

✨ The chosen technology stack ensures stable performance, ease of development, and long-term support.