Бета-версия Nuxt 3 была анонсирована 12 октября 2021 года после 16 месяцев работы и представляет новую основу на основе Vue 3, Vite и Nitro. Примерно через 6 месяцев после анонса бета-версии был объявлен первый релиз-кандидат для Nuxt 3 под названием «Mount Hope».

Релиз-кандидаты — это бета-версии, которые могут быть выпущены как стабильные. Это означает, что до выхода стабильной версии не ожидается серьезных критических изменений.

Vue 3 и TypeScript

Nuxt 3 создан, чтобы обеспечить отличные возможности Vue 3 наряду с отличной поддержкой SSR.

Nuxt позволяет вам испытать TypeScript без настройки. Для этого он автоматически создает конфигурацию TS (.nuxt/tsconfig.json) и файл универсального типа (.nuxt/nuxt.d.ts).

Чтобы узнать больше о TypeScript в Nuxt 3, вы можете прочитать сопутствующий документ.

Вайт и вебпак

С Nuxt 3 Vite стал сборщиком по умолчанию. Vite — это оболочка, цель которой — ускорить разработку современных веб-проектов. Nuxt 3 также поддерживает упаковку с последней версией Webpack (версия 5).

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

Одна из самых важных особенностей Nuxt 3 — новый серверный движок unjs/nitro. Nitro позволяет нам создавать пути API за пределами страниц в Nuxt. Таким образом, он дает возможность развивать полный стек. Кроме того, он дает возможность распространять приложение Nuxt на любую систему, поддерживающую JavaScript (Node.js, Serverless, Workers, рендеринг на стороне Edge и т. д.).

Nitro Engine также поддерживает добавление промежуточного программного обеспечения к конечным точкам API. Nuxt читает все файлы в каталоге /server/middleware для создания промежуточного программного обеспечения для вашего проекта, и эти файлы выполняются при каждом запросе. Обычно это используется для добавления общего заголовка ко всем ответам, регистрации ответов или изменения объекта входящего запроса.

Нажмите, чтобы посмотреть пример видео о серверном движке Nuxt.

Нуст Бридж

Nuxt Bridge — это слой, созданный для того, чтобы сделать переход с Nuxt 2 на Nuxt 3 максимально простым, позволяя вам испытать многие из новых функций Nuxt 3. Используя Nuxt Bridge, вы можете убедиться, что ваш проект готов к Nuxt 3. Чтобы использовать функции Nuxt 3 в существующих проектах Nuxt 2, вам необходимо установить @nuxt/bridge-edge в своем проекте. Этапы установки и дополнительную информацию можно найти здесь.

Nuxt Bridge, чтобы максимально упростить обновление:

  • Обратная совместимость для nuxt.config.js, используемого с Nuxt 2,
  • Nuxt 2 поддерживает обратную совместимость для модулей и плагинов.

В то же время новые функции, появившиеся в Nuxt 3, были перенесены в Nuxt 2. Таким образом, переход от Nuxt 2 к Nuxt 3 может осуществляться постепенно. Вот некоторые из этих особенностей:

  • Используя серверный движок Nitro с Nuxt 2,
  • Используя Composition API (такой же, как Nuxt 3) с Nuxt 2,
  • Используя новый CLI и DevTools с Nuxt 2,
  • Постепенно переходите на Nuxt 3,
  • Совместимость с модульной экосистемой Nuxt 2,
  • Обновление по частям (Nitro, Composition API, Nuxt Kit)

На изображении ниже вы можете увидеть сравнение версий Nuxt 2, Nuxt Bridge и Nuxt 3.

Нуси

Nuxi (Nuxt CLI) помогает создавать новые проекты без усилий. Он также обратно совместим, поэтому вы все равно можете пользоваться некоторыми его преимуществами, даже если вы используете Nuxt 2.

Новый комплект

Nuxt Kit призван упростить разработку модулей Nuxt. Он предоставляет пользователям новый гибкий опыт разработки модулей с совместимостью между версиями. Таким образом, это позволяет разрабатывать модули, которые будут работать как на Nuxt 2, так и на Nuxt 3.

Подводя итог, можно сказать о Nuxt 3:

  • Он поддерживает webpack 5 и Vite, которые поддерживают горячую замену модулей во время разработки и собирают ваш код для производства,
  • Он использует esbuild, поэтому вы можете написать последний синтаксис JavaScript, поддерживая старые браузеры,
  • Он использует Nuxi для интерфейса командной строки,
  • В качестве серверного движка используется Nitro.
  • Он использует Nuxt Kit в качестве комплекта разработки,
  • Он использует Nuxt Bridge для облегчения перехода с Nuxt 2.

Использованная литература: