我一直在构建一个线程应用程序克隆与帮助的JS掌握yt通道.但我得到了这个错误的错误:ClerkInstanceContext未找到.我尝试重新启动应用程序,替换代码。但没有任何变化。该怎么办?有人能帮我解决吗?
k3bvogb11#
我也从JS Mastery构建了next.js 13 Threads应用程序,结果也出现了同样的错误。但是我修复了它。我假设在路由组下 Package <ClerkProvider>有问题,或者类似的东西。我将其移动到(root)目录,并为(auth)组创建了一个特定于样式的layout.tsx,并将样式移动到那里。它工作了。以下是如何修复它:1.打开(root)目录下的layout.tsx1.将以下代码添加到(root)/layout.tsx中
<ClerkProvider>
(root)
(auth)
layout.tsx
(root)/layout.tsx
import "./globals.css"; import type { Metadata } from "next"; import { Inter } from "next/font/google"; import { ClerkProvider } from "@clerk/nextjs"; const inter = Inter({ subsets: ["latin"] }); export const metadata: Metadata = { title: "Threads", description: "A Next.js 13 Meta Threads App.", }; export default function RootLayout({ children, }: { children: React.ReactNode; }) { return ( <ClerkProvider> <html lang="en"> <body className={inter.className}>{children}</body> </html> </ClerkProvider> ); }
字符串1.将以下代码添加到(auth)/layout.tsx
(auth)/layout.tsx
export default function RootLayout({ children, }: { children: React.ReactNode; }) { return ( <div className="flex items-center justify-center h-screen bg-dark-1"> {children} </div> ); }
型如果你只想改变认证页面的样式,那么你应该在(auth)/layout.tsx中编辑样式,如果你想编辑整个应用的布局,那么就像编辑字体一样编辑(root)/layout.tsx。
hfyxw5xn2#
你可以尝试
<ClerkProvider> <html lang="en"> <body className={inter.className}>{children}</body> </html>
字符串到(root)/layout.tsx文件我就是这样解决这个问题的:)
pn9klfpd3#
确保你将<html></html>标签嵌入到你根目录的layout.tsx文件中的<ClerkProvider></ClerkProvider>标签中
<html></html>
<ClerkProvider></ClerkProvider>
wydwbb8l4#
您必须使用ClerkProvider Package 您的(auth)layout.tsx,并使用ClerkProvider Package 您的(root)layout.tsx。请确保您已登录以查看更改。
mwg9r5ms5#
入门页面必须为
async function Page() { return ( <main> <h1 className="head-text">Onboarding</h1> </main> ); } export default Page;
字符串和请注意您请求的URL,/sign-in或**/sign-up**,如果您尝试在登录URL中注册,您将获得错误
llycmphe6#
只是简单地添加周围的布局.tsx在(根)文件夹
export default function RootLayout({ children, }: { children: React.ReactNode }) { return ( <ClerkProvider> <html lang="en"> <body className={inter.className}>{children}</body> </html> </ClerkProvider> ) }
字符串
5f0d552i7#
在/root/layout.tsx中 Package html解决了我的问题。
7条答案
按热度按时间k3bvogb11#
我也从JS Mastery构建了next.js 13 Threads应用程序,结果也出现了同样的错误。
但是我修复了它。我假设在路由组下 Package
<ClerkProvider>
有问题,或者类似的东西。我将其移动到(root)
目录,并为(auth)
组创建了一个特定于样式的layout.tsx
,并将样式移动到那里。它工作了。以下是如何修复它:
1.打开
(root)
目录下的layout.tsx
1.将以下代码添加到
(root)/layout.tsx
中字符串
1.将以下代码添加到
(auth)/layout.tsx
型
如果你只想改变认证页面的样式,那么你应该在
(auth)/layout.tsx
中编辑样式,如果你想编辑整个应用的布局,那么就像编辑字体一样编辑(root)/layout.tsx
。hfyxw5xn2#
你可以尝试
字符串
到(root)/layout.tsx文件
我就是这样解决这个问题的:)
pn9klfpd3#
确保你将
<html></html>
标签嵌入到你根目录的layout.tsx文件中的<ClerkProvider></ClerkProvider>
标签中wydwbb8l4#
您必须使用ClerkProvider Package 您的(auth)layout.tsx,并使用ClerkProvider Package 您的(root)layout.tsx。请确保您已登录以查看更改。
mwg9r5ms5#
入门页面必须为
字符串
和
请注意您请求的URL,/sign-in或**/sign-up**,如果您尝试在登录URL中注册,您将获得错误
llycmphe6#
只是简单地添加周围的布局.tsx在(根)文件夹
字符串
5f0d552i7#
在/root/layout.tsx中 Package html解决了我的问题。