Анонс Nuxt 4.0

Nuxt 4.0 вышел! 🎉

После года тестирования в реальных проектах мы рады объявить официальный релиз Nuxt 4. Это мажорный релиз с упором на стабильность и несколько продуманных breaking changes ради улучшения опыта разработки.

Если вы следили за развитием, многие изменения будут знакомы; если нет — надеемся, они вам понравятся.

🔥 Что нового?

Nuxt 4 делает разработку удобнее:

• Понятная структура проекта — новая директория app/
• Умная загрузка данных — устранены несогласованности и улучшена производительность слоя данных
• Лучшая поддержка TypeScript — разделение контекстов: код приложения, серверный код, папка shared/ и конфигурация
• Быстрее CLI и dev — внутренние сокеты и ускоренный CLI

Почему именно эти изменения? В основном потому, что такие улучшения потребовали технически breaking changes.

Мы стараемся не раздувать релизы: улучшения выходили в минорных версиях Nuxt 3, а не копились к одному большому релизу.

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

Рекомендуем перед началом прочитать руководство по обновлению, чтобы понять, что может затронуть ваше приложение.

🗂️ Новая структура проекта

Главное видимое изменение — организация кода. Код приложения по умолчанию лежит в директории app/:

my-nuxt-app/
├─ app/
│  ├─ assets/
│  ├─ components/
│  ├─ composables/
│  ├─ layouts/
│  ├─ middleware/
│  ├─ pages/
│  ├─ plugins/
│  ├─ utils/
│  ├─ app.vue
│  ├─ app.config.ts
│  └─ error.vue
├─ content/
├─ public/
├─ shared/
├─ server/
└─ nuxt.config.ts

Так код отделён от node_modules/ и .git/, а file watchers работают быстрее (особенно на Windows и Linux). IDE лучше понимает, работаете вы с клиентским или серверным кодом.

🎨 Обновлённые UI-шаблоны

Стартовые шаблоны Nuxt обновлены: улучшена доступность, заголовки по умолчанию и полировка (#27843).

🔄 Умная загрузка данных

useAsyncData и useFetch доработаны. Несколько компонентов с одним ключом автоматически делят данные. При размонтировании данные очищаются, реактивные ключи позволяют перезапрашивать по необходимости, плюс больше контроля над использованием кэша.

Часть этого уже была в минорных релизах Nuxt v3. В v4 другие значения по умолчанию, и мы продолжим развивать слой данных.

🔧 Удобнее TypeScript

Nuxt создаёт отдельные TypeScript-проекты для кода приложения, сервера, папки shared/ и сборщика. Ожидаются лучший автокомплит, точнее вывод типов и меньше путаницы при переключении контекстов.

При обновлении именно TypeScript чаще всего может преподнести сюрпризы, но в перспективе работа с типами станет проще. Если что-то пойдёт не так — напишите нам. 🙏

⚡ Быстрее CLI и разработка

Параллельно с v4 мы ускоряли @nuxt/cli.

• Быстрый холодный старт — dev-сервер запускается заметно быстрее
• Node.js compile cache — автоматическое использование v8 compile cache
• Нативный file watching — fs.watch вместо тяжёлых решений, меньше нагрузка на систему
• Общение по сокетам — CLI и Vite dev server общаются через внутренние сокеты вместо сетевых портов, меньше накладных расходов, особенно на Windows

В сумме это заметно меняет ежедневный опыт разработки; в планах ещё улучшения.

🚀 Как обновиться

У мажорного релиза всегда есть breaking changes, но мы стремились сделать обновление максимально простым. Большинство изменений можно было проверять флагом совместимости больше года.

В большинстве проектов обновление пройдёт гладко, но стоит учесть:

• Совместимость с Nuxt 2 убрана из @nuxt/kit. (В первую очередь это касается авторов модулей.)
• Удалены устаревшие утилиты и deprecated-возможности.
• Новая настройка TypeScript может выявить ранее скрытые проблемы типов.
• Некоторым модулям понадобятся доработки для полной совместимости с Nuxt 4.

Для большинства breaking changes в конфиге есть опции, чтобы временно вернуть старое поведение.

1. Обновить Nuxt

Рекомендуем выполнить:

npx nuxt upgrade --dedupe

Команда также дедуплицирует lockfile и подтянет обновления зависимостей Nuxt, в том числе из экосистемы unjs.

2. По желанию: инструменты миграции

Мы автоматизировали многие (но не все) шаги миграции с Codemod:

npx codemod@latest nuxt/4/migration-recipe

yarn dlx codemod@latest nuxt/4/migration-recipe

pnpm dlx codemod@latest nuxt/4/migration-recipe

bun x codemod@latest nuxt/4/migration-recipe

3. Проверить и поправить

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

Лучше прочитать его целиком до начала обновления, чтобы понять, что может затронуть ваше приложение.

🗺️ Дальнейшие планы

Планируем быстрые патч-релизы по мере появления проблем. Nuxt 3 будет получать обновления (исправления и бэкпорты из Nuxt 4) до конца января 2026, так что с миграцией можно не спешить.

В перспективе — релиз Nuxt 5 с Nitro v3 и h3 v2 для ещё большей производительности и Vite Environment API для более быстрой и удобной разработки. В работе и другие идеи.

Помимо мажорных релизов, в ветки 3.x и 4.x планируем добавлять: SSR streaming (#4753), модуль доступности (#23255), встроенные стратегии кэширования fetch (#26017), более строгую типизацию fetch (в Nitro v3), динамическое обнаружение маршрутов (#32196), мульти-приложения (#21635) и другое.

❤️ Благодарности

Этот релиз — заслуга многих, особенно тех, кто тестировал режим совместимости v4 последний год. Спасибо за помощь!

Удачной разработки на Nuxt 4! 🚀

📑 Полный список изменений

Огромное спасибо всем, кто участвовал в этом релизе. ❤️