Nuxt

Nuxt – это фреймворк на основе Vue.js для сайтов и веб-приложений, который умеет собирать страницы на сервере, заранее при сборке или в браузере посетителя. Для Vue он делает то же, что Next.js для React: превращает набор компонентов в полноценный сайт с адресами, мета-тегами и готовым HTML.

Если интерфейс на Vue.js должен приводить людей из поиска, рано или поздно встаёт вопрос серверного рендеринга. Документация Vue советует решать его готовым фреймворком, а не писать своё решение. Самый известный такой фреймворк и есть Nuxt.

Кто развивает фреймворк и что с версиями

Nuxt развивает команда NuxtLabs, она же создала серверный движок Nitro. В июле 2025 года NuxtLabs вошла в состав Vercel, той же компании, что стоит за Next.js. Команда пообещала, что Nuxt остаётся под лицензией MIT с открытой дорожной картой.

По версиям на октябрь 2026 года картина такая:

• Nuxt 4 стабилен с 16 июля 2025 года, актуальная версия 4.5 вышла в июле 2026-го;
• Nuxt 3 перестал поддерживаться 31 июля 2026 года, исправлений ошибок и безопасности для него больше нет;
• Nuxt 2 не поддерживается с 30 июня 2024 года;
• Nuxt 5 с новой версией Nitro команда ориентировочно планирует на четвёртый квартал 2026 года.

Что Nuxt добавляет к Vue

• Адреса по структуре папок: файл в папке app/pages/ становится страницей сайта.
• Автоимпорт: компоненты и функции подключаются сами, без ручных строк import.
• Серверный движок Nitro. Сайт и серверная часть собираются в одну папку .output, которую можно развернуть на сервере Node.js, в бессерверной среде или выгрузить статикой.
• Модули: готовые расширения для картинок, контента и интеграций со сторонними сервисами. У команды Nuxt есть и библиотека компонентов интерфейса Nuxt UI.

Режимы рендеринга и routeRules

По умолчанию Nuxt работает в универсальном режиме: сервер выполняет код Vue и отдаёт готовую HTML-страницу, а в браузере Vue оживляет её, это называют гидратацией. Почему это важно для поиска, разобрано в статье JavaScript SEO: CSR и SSR.

Самое полезное для бизнеса здесь гибридный режим. В настройках задают правила для разных разделов сайта:

routeRules: {
  '/blog/**': { isr: true },
  '/catalog/**': { swr: 3600 },
  '/account/**': { ssr: false }
}

Ответы для статей блога кэшируются на CDN, если хостинг это поддерживает. Каталог отдаётся из кэша, а раз в час (3 600 секунд) пересобирается в фоне. Личный кабинет рендерится только в браузере: поисковику он не нужен, а серверу меньше работы. Есть ещё prerender, при нём страница собирается при сборке проекта, как обычный статический файл. Для каталога, где цены меняются каждый час, такой режим не годится: без пересборки посетители увидят устаревшие цены.

Nuxt и Next.js: для какой задачи что

По возможностям они близки: серверный рендеринг, статическая генерация, кэш с фоновым обновлением, серверный код рядом с интерфейсом. Выбор почти всегда следует из того, на чём написан интерфейс. Про второй вариант подробнее в статье Next.js.

Что учесть при поддержке сайта

• Сайт на Nuxt 3 или Nuxt 2 пора переводить на Nuxt 4, даже если он «и так работает»: исправлений безопасности для старых версий больше не будет. По политике проекта каждую мажорную версию поддерживают минимум полгода после выхода следующей. С выходом Nuxt 5 этот отсчёт начнётся и для Nuxt 4.
• Модули обновляются со своей скоростью. Перед переходом на новую версию проверяют, что все модули проекта её поддерживают.
• Команда. Для поддержки нужен Vue-разработчик с опытом серверного рендеринга. Ошибки гидратации, когда HTML с сервера не совпадает с тем, что собрал браузер, и проблемы с кэшем характерны именно для таких проектов.
• Хостинг. Для универсального режима нужен сервер с Node.js или платформа, которую поддерживает Nitro. Полностью статический сайт отдаст любой веб-сервер, но без серверной логики. А вот выключать SSR на всём сайте ради простого хостинга не стоит: получится одностраничное приложение с теми же проблемами индексации. Про выбор площадки в статье Хостинг.

Как проверить, на чём сделан сайт

• В исходном коде страницы (Ctrl+U) пути к скриптам начинаются с /_nuxt/.
• Корневой блок страницы обычно имеет идентификатор __nuxt.
• Wappalyzer определяет Nuxt, а расширение Vue DevTools показывает компоненты Vue.
• Номер версии в package.json покажет, нужен ли переход на Nuxt 4.

Выбор фреймворка, переход с третьей версии и настройка рендеринга

Сайты на Nuxt делаем в составе услуги разработка сайтов. Если проект уже работает на Nuxt, берём его на доработку и техническую поддержку.

Документация и анонсы команды

• Документация Nuxt: разделы «Introduction», «Rendering Modes» и «Roadmap»
• Блог Nuxt: «Nuxt 4.5», июль 2026 года
• Блог Vercel: «NuxtLabs joins Vercel», 8 июля 2025 года
• Документация Vue.js: раздел «Server-Side Rendering»