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

Question

我正在 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，但在本地或 GitHub 的 NextAuth package.json 中的任何地方都没有看到 /google 特定导出。应该有吗？我错过了什么？

Answer 1

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