Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Error requests unstable_setRequestLocale at app/[locale]/page.tsx #543

Closed
FourwingsY opened this issue Oct 3, 2023 · 4 comments
Closed

Error requests unstable_setRequestLocale at app/[locale]/page.tsx #543

FourwingsY opened this issue Oct 3, 2023 · 4 comments
Labels
bug Something isn't working unconfirmed Needs triage.

Comments

@FourwingsY
Copy link

FourwingsY commented Oct 3, 2023 •
edited
Loading

Description

in 3.0 rc

While root page is client component, and root layout uses `unstable_setRequestLocale()`, 
This error occurs in root page.

Error occurred prerendering page "/en". Read more: https://nextjs.org/docs/messages/prerender-error

Error: Usage of next-intl APIs in Server Components currently opts into dynamic rendering. This limitation will eventually be lifted, but as a stopgap solution, you can use the `unstable_setRequestLocale` API to enable static rendering, see https://next-intl-docs.vercel.app/docs/getting-started/app-router-server-components#static-rendering

// app/[locale]/layout.tsx

export function generateStaticParams() {
  const locales = ['en', 'ko', 'ja'];
  return locales.map(locale => ({ locale }));
}

export default function RootLayout({ children, params }: LayoutProps<{ locale: string }>) {
  const locale = useLocale();

  // Show a 404 error if the user requests an unknown locale
  if (params.locale !== locale) notFound();

  unstable_setRequestLocale(locale);

  return (
    <html> ... {children} </html>
  )
// app/[locale]/page.tsx

'use client';

export default function RootPage() {
  // doing some token check with useEffect()

  return <SomeEmptyPage />
}

Mandatory reproduction URL (CodeSandbox or GitHub repository)

https://codesandbox.io/p/sandbox/next-intl-bug-template-app-forked-23pc3x

Reproduction description

Steps to reproduce:

  1. Open reproduction
  2. Build it

Expected behaviour

page with client component should pass.
@FourwingsY FourwingsY added bug Something isn't working unconfirmed Needs triage. labels Oct 3, 2023
@amannn
Copy link
Owner

amannn commented Oct 3, 2023

You have to call unstable_setRequestLocale before you call any hooks from next-intl (in your case: useMessages).

I should probably mention this explicitly in the docs, thanks for the report!

@FourwingsY
Copy link
Author

Got it. Yes, that makes it work! Thanks!
If you are okay, then I will make PR.

@amannn
Copy link
Owner

amannn commented Oct 3, 2023

Fixed as part of 5c1bac3

@amannn amannn closed this as completed Oct 3, 2023
@amannn
Copy link
Owner

amannn commented Oct 3, 2023

Oh thanks, thank you so much for offering this! I just had a minute to do it! :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug Something isn't working unconfirmed Needs triage.
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@FourwingsY @amannn