开发者问题收集

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

2021-12-29
650

我正在 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 页面中使用提供程序,其中包含以下代码:

...
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 特定导出的内容。应该有吗?我遗漏了什么?

1个回答
  1. 确保您拥有兼容的节点版本,我使用的是 12.22.1。
  2. 检查 [...nextauth].js 文件名是否正确写入。
Johan Altamar
2021-12-31