如何在Nuxt3中使用nuxtjs/auth-next模块？启动报错求助

问题说明 #

给 Nuxt3 应用添加认证功能，按文档配置 @nuxtjs/auth-next 后启动报错，错误截图如下：

当前 nuxt.config.js 配置代码：

// nuxt.config.js
export default defineNuxtConfig({
    auth: {
        // ...
    },
    modules: [
        // '@nuxtjs/axios',
        '@nuxtjs/auth-next'
    ],
})

此前启用 @nuxtjs/axios 时也出现相同错误，已按官方建议注释该包，改用内置 $fetch API，但仍无法定位错误原因。

解决方案 #

核心问题 #

@nuxtjs/auth-next 是为 Nuxt2 开发的认证模块，完全不适配 Nuxt3，这是导致启动报错的根本原因。Nuxt3 官方推荐使用 @sidebase/nuxt-auth（原 nuxt-auth）作为认证方案。

修复步骤 #

1. 卸载不适配的旧模块：

npm uninstall @nuxtjs/auth-next

2. 安装 Nuxt3 适配的认证模块：

npm install @sidebase/nuxt-auth

3. 更新 nuxt.config.js 配置：

export default defineNuxtConfig({
  modules: ['@sidebase/nuxt-auth'],
  auth: {
    // 根据需求配置认证策略，示例为本地账号密码模式
    provider: {
      type: 'local'
    }
  }
})

4. 后续可根据业务需求，配置对应认证策略（如 OAuth、Credentials 等）。

另外，你注释 @nuxtjs/axios 改用内置 $fetch API 的操作是正确的，Nuxt3 已原生支持更便捷的数据获取方案，无需额外安装 axios 模块。

内容的提问来源于stack exchange，提问作者fudo