Введение

Цель Nuxt — сделать веб-разработку интуитивно понятной и производительной.

Nuxt — бесплатный фреймворк с открытым исходным кодом, который даёт интуитивный и расширяемый способ создавать типобезопасные, производительные и готовые к продакшену веб-приложения и сайты полного стека (клиент и сервер) на Vue.js.

Мы делаем всё, чтобы вы могли сразу писать .vue‑файлы, наслаждаясь горячей заменой модулей в разработке и на релизе — производительным приложением с серверным рендерингом по умолчанию.

Nuxt не привязан к вендору и позволяет развернуть приложение где угодно, в том числе на периферии.

Если вы хотите поиграться с Nuxt в браузере, вы можете опробовать его в одной из наших онлайн-песочниц.

Автоматизация и соглашения

Nuxt использует соглашения и продуманную структуру каталогов, чтобы автоматизировать повторяющиеся действия и позволить разработчикам сосредоточиться на разработке новых функций. Конфигурационный файл по-прежнему может настраивать и переопределять поведение проекта по умолчанию.

  • Маршрутизация по файлам: задавайте URL по структуре каталога pages/ — проще организовать приложение и не нужна ручная настройка маршрутов.
  • Разделение кода (code splitting): Nuxt сам режет бандл на чанки, что сокращает объём JS при первой загрузке.
  • SSR из коробки: встроенный серверный рендеринг без отдельной настройки Node-сервера.
  • Автоимпорты: композаблы и компоненты в нужных папках доступны без ручных import, с tree-shaking и оптимизацией бандла.
  • Утилиты для данных: композаблы для SSR-совместимой загрузки данных и разные стратегии кэширования.
  • TypeScript без возни: типобезопасный код с автогенерируемыми типами и tsconfig.json, даже если вы только начинаете с TS.
  • Настроенные инструменты сборки: по умолчанию мы используем Vite — с горячей заменой модулей (HMR) в разработке и со сборкой кода для продакшена по современным практикам.

Nuxt закрывает и клиентскую, и серверную сторону, чтобы вы могли сосредоточиться на главном — своём веб-приложении.

Рендеринг на стороне сервера (SSR)

Nuxt по умолчанию поставляется со встроенными возможностями рендеринга на стороне сервера (SSR), без необходимости самостоятельной настройки сервера, что имеет множество преимуществ для веб-приложений:

  • Быстрее первый экран: Nuxt отдаёт готовый HTML, который браузер может показать сразу — это заметнее на медленной сети и слабом устройстве.
  • Лучше для SEO: краулеры получают контент в HTML сразу, без обязательного выполнения JavaScript на клиенте.
  • Меньше нагрузки на клиент: сокращается объём JS, который нужно загрузить и выполнить — проще для слабых устройств и тяжёлых интерфейсов.
  • Доступность: содержимое есть в первом ответе, что помогает пользователям скринридеров и вспомогательных технологий.
  • Упрощённое кэширование: страницы можно кэшировать на сервере, что ещё сильнее ускоряет отдачу за счёт меньшего времени на генерацию и отправку контента клиенту.

В сумме SSR ускоряет восприятие сайта, упрощает SEO и повышает доступность.

Поскольку Nuxt — универсальный фреймворк, вы можете статически сгенерировать всё приложение для статического хостинга через nuxt generate, глобально отключить SSR (ssr: false) или настроить гибридный рендеринг через routeRules.

Узнать больше режимы рендеринга Nuxt.

Серверный движок

Серверный движок Nitro открывает новые возможности полного стека.

При разработке он использует воркеры Rollup и Node.js для изоляции вашего серверного кода и контекста. Он также генерирует ваш серверный API, считывая файлы в server/api/ и серверные посредники из server/middleware/.

При сборке Nitro объединяет ваше приложение и сервер в один общий каталог .output. Он компактен: минифицирован и очищен от лишних модулей Node.js (кроме полифилов). Его можно развернуть в любой среде с JavaScript — от Node.js и serverless до воркеров, рендеринга на edge и чистой статики.

Узнать больше серверный движок Nuxt.

Готовность к продакшену

Приложение Nuxt можно развернуть на Node или Deno, отдать как статику, в serverless или на edge-платформах.

Узнать больше Секция развертывания.

Модульная система

Система модулей расширяет Nuxt своими возможностями и интеграциями со сторонними сервисами.

Узнать больше концепция модулей Nuxt.

Архитектура

Nuxt состоит из нескольких основных пакетов:

Мы рекомендуем прочитать каждую концепцию, чтобы иметь полное представление о возможностях Nuxt и области действия каждого пакета.