# @trapar-waves/vue-tailwind

[![npm version](https://img.shields.io/npm/v/@trapar-waves/vue-tailwind)](https://www.npmjs.com/package/@trapar-waves/vue-tailwind)
[![npm downloads](https://img.shields.io/npm/dm/@trapar-waves/vue-tailwind)](https://www.npmjs.com/package/@trapar-waves/vue-tailwind)
[![License](https://img.shields.io/github/license/Trapar-waves/vue-tailwind)](https://github.com/Trapar-waves/vue-tailwind/blob/main/LICENSE)
[![Last commit](https://img.shields.io/github/last-commit/Trapar-waves/vue-tailwind)](https://github.com/Trapar-waves/vue-tailwind/commits/main)
[![CI Status](https://img.shields.io/github/actions/workflow/status/Trapar-waves/vue-tailwind/release.yml?label=CI)](https://github.com/Trapar-waves/vue-tailwind/actions/workflows/release.yml)
[![Renovate](https://img.shields.io/badge/renovate-enabled-blue)](https://renovatebot.com/)

[English](../README.md) | [中文](/readme/README-CN.md) | [日本語](/readme/README-JP.md)

> Шаблон проекта Vue 3 с интеграцией Tailwind CSS и современными инструментами разработки для быстрой фронтенд-разработки.

## ✨ Особенности

- **Vue 3**: Используйте последние возможности Vue для создания пользовательских интерфейсов.
- **Tailwind CSS v4**: CSS-фреймворк с подходом utility-first для быстрой разработки UI.
- **TypeScript**: Строгая типизация для лучшего качества кода и опыта разработки.
- **Rsbuild**: Быстрый и эффективный инструмент сборки для современной веб-разработки.
- **@vueuse/core**: Коллекция основных утилит композиции Vue.
- **Интеграция Iconify**: Легко используйте иконки из Iconify с Tailwind CSS.
- **ESLint & Конфигурация Antfu**: Принудительное соблюдение стиля кода и лучших практик.
- **PostCSS**: Обработка CSS с `@tailwindcss/postcss` для оптимальной интеграции Tailwind.

## 💻 Технологический стек

- **Фреймворк**: [Vue 3](https://v3.vuejs.org/)
- **Стилизация**: [Tailwind CSS v4](https://tailwindcss.com/)
- **Управление состоянием**: [VueUse](https://vueuse.org/)
- **Инструмент сборки**: [Rsbuild](https://rsbuild.dev/)
- **Язык**: [TypeScript](https://www.typescriptlang.org/)
- **Линтинг**: [ESLint](https://eslint.org/) с [конфигурацией Antfu](https://github.com/antfu/eslint-config)
- **Иконки**: [Iconify](https://iconify.design/) с [плагином Tailwind](https://docs.iconify.design/)

Полный список зависимостей см. в файле [package.json](./package.json).

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

### Предварительные требования

- Node.js (>= 18.x рекомендуется)
- Менеджер пакетов (npm, yarn или pnpm)

```bash
node -v
npm -v # или yarn -v / pnpm -v
```

### Создание проекта

Создайте новый проект с использованием шаблона:

```bash
pnpm create trapar-waves
```

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

Перейдите в каталог проекта и установите зависимости:

```bash
# С использованием npm
npm install

# С использованием yarn
yarn install

# С использованием pnpm
pnpm install
```

### Разработка

Запустите сервер разработки:

```bash
# С использованием npm
npm run dev

# С использованием yarn
yarn dev

# С использованием pnpm
pnpm dev
```

### Сборка

Создайте производственную сборку:

```bash
# С использованием npm
npm run build

# С использованием yarn
yarn build

# С использованием pnpm
pnpm build
```

### Предварительный просмотр

Локальный предварительный просмотр производственной сборки:

```bash
# С использованием npm
npm run preview

# С использованием yarn
yarn preview

# С использованием pnpm
pnpm preview
```

## 🧪 Линтинг

Проверьте код с помощью ESLint:

```bash
# С использованием npm
npm run lint

# С использованием yarn
yarn lint

# С использованием pnpm
pnpm lint
```

## 🤝 Участие в разработке

Вклад приветствуется! Вот как вы можете поучаствовать:

1. Сделайте форк репозитория
2. Создайте ветку с функцией (`git checkout -b feature/amazing-feature`)
3. Зафиксируйте изменения (`git commit -m 'Add some amazing feature'`)
4. Отправьте изменения в ветку (`git push origin feature/amazing-feature`)
5. Откройте Pull Request

Убедитесь, что ваш код соответствует руководящим принципам по стилю проекта и проходит все тесты.

## 👤 Автор

**Rikka**

- Email: [admin@rikka.cc](mailto:admin@rikka.cc)
- GitHub: [Muromi-Rikka](https://github.com/Muromi-Rikka)

## 📄 Лицензия

Этот проект лицензирован по лицензии MIT - см. файл [LICENSE](./LICENSE) для получения подробной информации.

## 🔗 Ссылки

- **Репозиторий**: [https://github.com/Trapar-waves/vue-tailwind](https://github.com/Trapar-waves/vue-tailwind)
- **Домашняя страница**: [https://github.com/Trapar-waves/vue-tailwind](https://github.com/Trapar-waves/vue-tailwind)
- **Проблемы**: [https://github.com/Trapar-waves/vue-tailwind/issues](https://github.com/Trapar-waves/vue-tailwind/issues)