尝试将 NextAuth.js 提供程序与 Next.js 一起使用时,导致此导出错误的原因是什么?

What is causing this export error when trying to use a NextAuth.js Provider with Next.js?

我正在 React/Next.js 中创建我的第一个项目,使用 NextAuth.js 作为 Auth-N。我大致遵循 NextAuth 网站上的入门指南,并创建了一个 [...nextauth].js 页面,其中包含以下代码:

import NextAuth from 'next-auth';
import GoogleProvider from 'next-auth/providers/google';
export default NextAuth({
    providers: [
        GoogleProvider({
            clientId: process.env.GOOGLE_CLIENT_ID,
            clientSecret: process.env.GOOGLE_CLIENT_SECRET,
        })
    ]
})

我在包含以下代码的 Header.js 页面中使用 Provider:

...
import {useSession, signIn, signOut} from 'next-auth/react';

const Header = () => {
    const { data: session } = useSession()
    ...

    return (
        <header className="border-b border-gray-100 dark:border-gray-700">
            <div className="container mx-auto px-4 sm:px-6 py-4 flex justify-between items-center">
                <Logo />

                <div className={"flex items-center space-x-1 sm:space-x-2"}>
                    {!session ? (
                        <button type="button" onClick={() => signIn()} className="bg-blue-700 text-white px-4 py-2 rounded-md focus:outline-none focus:ring-4 focus:ring-blue-600 focus:ring-opacity-50 whitespace-nowrap">Sign in</button>
                    ) : (
                        <button type="button" onClick={() => signOut()} className="bg-blue-700 text-white px-4 py-2 rounded-md focus:outline-none focus:ring-4 focus:ring-blue-600 focus:ring-opacity-50 whitespace-nowrap">Sign out</button>
                    )}

                </div>
            </div>
        </header>
    )
};

export default Header;

但是,当我使用 'npm run dev' 启动我的网站并尝试登录时,出现以下错误:

Server Error
Error: Package subpath './providers/google' is not defined by "exports" in /Users/tysont/Workspace/brightnote/node_modules/next-auth/package.json

我正在使用 NextAuth 4.0.6,但我没有在 NextAuth package.json 本地或 GitHub 的任何地方看到提到的 /google 特定导出。应该有吗?我错过了什么?

  1. 确保您有兼容的节点版本,我使用的是 12.22.1。
  2. 检查[...nextauth].js文件名是否写对了。