Плагины и Middleware
Узнайте, как мигрировать из Nuxt 2 в Nuxt Bridge с новыми плагинами и middleware.
Новый формат плагинов
Теперь вы можете мигрировать на API-интерфейс плагинов Nuxt 3, который немного отличается по формату от Nuxt 2.
Плагины теперь принимают только один аргумент (nuxtApp
). Вы можете узнать больше в документации.
plugins/hello.ts
export default defineNuxtPlugin(nuxtApp => {
nuxtApp.provide('injected', () => 'моя внедряемая функция')
// теперь доступен в `nuxtApp.$injected`
})
Если вы хотите использовать новые композаблы Nuxt (такие как
useNuxtApp
или useRuntimeConfig
) в своих плагинах, вам необходимо будет использовать хелпер defineNuxtPlugin
для этих плагинов.Хотя интерфейс совместимости предоставляется через
nuxtApp.vueApp
, вы должны избегать регистрации плагинов, директив, миксинов или компонентов таким способом без добавления собственной логики, чтобы обеспечить их установку не более одного раза, иначе это может привести к утечке памяти.Новый формат Middleware
Теперь вы можете мигрировать на API-интерфейс middleware Nuxt 3, который немного отличается по формату от Nuxt 2.
Middleware теперь принимает только два аргумента (to
, from
). Вы можете узнать больше в документации.
export default defineNuxtRouteMiddleware((to) => {
if (to.path !== '/') {
return navigateTo('/')
}
})
Использование
defineNuxtRouteMiddleware
вне директории middleware не поддерживается.definePageMeta
Вы также можете использовать definePageMeta
в Nuxt Bridge.
Это можно включить с помощью опции macros.pageMeta
в вашем файле конфигурации.
nuxt.config.ts
import { defineNuxtConfig } from '@nuxt/bridge'
export default defineNuxtConfig({
bridge: {
macros: {
pageMeta: true
}
}
})
Но только для
middleware
и layout
.