Модули

Совместимость модулей

Nuxt 3 имеет базовый слой обратной совместимости для модулей Nuxt 2 с использованием автоматических оберток @nuxt/kit. Однако, обычно требуются шаги для обеспечения совместимости модулей с Nuxt 3, и иногда - для кросс-версионной совместимости - требуется использовать Nuxt Bridge.

Мы подготовили Отдельное руководство по созданию готовых к Nuxt 3 модулей с использованием @nuxt/kit. В настоящее время лучшим путем миграции является следование этому руководству, чтобы переписать ваши модули. Оставшаяся часть этого руководства включает в себя шаги подготовки, если вы предпочитаете избежать полной переписи, но при этом сделать модули совместимыми с Nuxt 3.

Совместимость плагинов

Плагины Nuxt 3 имеют не полностью обратную совместимость с Nuxt 2.

Совместимость с Vue

Плагины или компоненты, использующие Composition API, требуют исключительной поддержки Vue 2 или Vue 3.

Используя vue-demi, они должны быть совместимы с Nuxt 2 и 3.

Миграция модулей

Когда пользователи Nuxt 3 добавляют ваш модуль, у вас не будет доступа к контейнеру модуля (this.*), поэтому вам необходимо использовать утилиты из @nuxt/kit, чтобы получить доступ к функционалу контейнера.

Тестирование с @nuxt/bridge

Миграция к @nuxt/bridge является первым и самым важным шагом для поддержки Nuxt 3.

Если у вас есть фикстура или пример в вашем модуле, добавьте пакет @nuxt/bridge в его конфигурацию (см. пример)

Миграция из CommonJS в ESM

Nuxt 3 нативно поддерживает TypeScript и модули ECMAScript. Пожалуйста, проверьте Native ES Modules для получения дополнительной информации и обновления.

Обеспечение экспорта плагинов по умолчанию

Если вы внедряете плагин Nuxt, который не имеет export default (например, глобальные плагины Vue), убедитесь, что вы добавили export default () => { } в конец файла.

// ~/plugins/vuelidate.js
import Vue from 'vue'
import Vuelidate from 'vuelidate'

Vue.use(Vuelidate)

Избегайте Runtime модулей

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

Ваш модуль должен работать даже в том случае, если он добавлен только в buildModules (а не в modules). Например:

• Избегайте обновления process.env внутри модуля Nuxt и чтения его с помощью плагина Nuxt. Вместо этого используйте runtimeConfig.
• (*) Избегайте зависимости от хуков runtime, таких как vue-renderer:* для продакшена
• (*) Избегайте добавления serverMiddleware путем импорта их внутри модуля. Вместо этого добавляйте их с помощью ссылки на путь к файлу, чтобы они были независимы от контекста модуля.

(*) Пока это не предназначено только для целей nuxt dev и не защищено с помощью if (nuxt.options.dev) { }.

Используйте TypeScript (опционально)

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