插件和中间件 Plugins and Middleware

Nuxt3迁移指南 - 插件和中间件

Plugins

插件现在有一种不同的格式,并且只接受一个参数(nuxtApp)。 在 文档 中阅读更多内容。

js
Nuxt 2
js
export default (ctx, inject) => {
  inject('injected', () => '我注入的功能')
}

您可以在 文档 中阅读更多关于 nuxtApp 格式的信息。

迁移步骤

  1. 迁移您的插件以使用 defineNuxtPlugin 辅助函数。
  2. 删除位于 plugins/ 文件夹中的 nuxt.config 插件数组中的所有条目。 顶层目录中的所有文件(以及任何子目录中的任何索引文件)都将自动注册。 您可以在文件名中指明这一点,而不是将 mode 设置为 clientserver。 例如,~/plugins/my-plugin.client.ts 只会在客户端加载。

路由中间件

路由中间件有不同的格式。

js
Nuxt 2
js
export default function ({ store, redirect }) {
  // 如果用户未通过身份验证
  if (!store.state.authenticated)
    return redirect('/login')
}

与 Nuxt 2 非常相似,放在 ~/middleware 文件夹中的路由中间件会自动注册。 然后您可以在组件中按名称指定它。 但是,这是通过“definePageMeta”完成的,而不是作为组件选项。

navigateTo 是众多路由辅助函数之一,您可以在 关于路由中间件的文档 中阅读更多相关信息。

迁移步骤

  1. 迁移您的路由中间件以使用 defineNuxtRouteMiddleware 帮助函数。
  2. 任何全局中间件(例如在您的 nuxt.config 中)都可以放在您的 ~/middleware 文件夹中,扩展名为 .global,例如 ~/middleware/auth.global.ts