Перейти к основному содержимому

Nuxt Modern Template

Стартовый шаблон для Nuxt 4. База — чистый проект с TypeScript и линтингом; всё остальное выбирается в CLI при генерации.

Установка

Развернуть можно через мой инструмент Stack:

npx @davidaganov/stack

Выбери Nuxt Modern Template, затем архитектуру и нужные модули.

Зачем

Nuxt из коробки даёт много возможностей, но на старте всё равно остаётся рутина: настроить TypeScript, ESLint и Prettier, решить как раскладывать код, подключить i18n и/или SEO, собрать страницы. Этот шаблон для @davidaganov/stack: CLI складывает слои в нужном порядке, мержит конфиги и отдаёт готовый проект.

Репозиторий шаблона — не готовое приложение, а набор слоёв для генератора. Запускать npm run dev нужно уже в сгенерированном проекте.

Архитектура

При генерации выбирается один из двух вариантов:

РежимОписание
FlatОдин каталог app/ — проще для небольших сайтов и MVP
LayeredКорневой app/ + layers/base + layers/ui — удобно, для большого сайта и когда нужно разделить домен и UI

Layered-вариант близок к тому, как устроены крупные Nuxt-проекты с изолированными слоями. Подробнее про идею — в статье «Работа со слоями в Nuxt 3».

Что внутри

Базовая сборка: Nuxt 4, Vue 3, TypeScript, @nuxt/eslint, Prettier, скрипт генерации favicon.

Опциональные модули:

  • Tailwind CSS — стили и @tailwindcss/vite
  • Pinia — стор с @pinia/nuxt
  • i18n@nuxtjs/i18n с типизированными локалями и Polyglot Keeper для синхронизации переводов
  • SEO@nuxtjs/seo: meta, OG-изображения, sitemap, robots
  • Content@nuxt/content с примером блога и markdown-контентом
  • Tests — Vitest + @nuxt/test-utils

Режимы генерации те же, что у остальных шаблонов Stack: recommended (всё включено + демо), custom (выбор фич вручную) или empty (минимум).

Требования: Node.js >= 22.5.

Итог

Хороший выбор для старта на Nuxt 4 без первичной настройки с нуля: flat или layered, нужные модули — и на выходе проект с предсказуемой структурой вместо пустого nuxi init.