Docs: App Router Guides Internationalization
What is the documentation issue?
There is a wrong information about the type of the lang param when reading from params.
While trying to implement intl for a next.js 16 app router based project. Using the given way (from the doc) to read the params in my root layout: (Note i use 'en' as short for english , not 'en-US' because i do not play on different 'en' support)
`export async function generateStaticParams() { return [{ lang: 'en' }, { lang: 'de' }] }
export default async function RootLayout({ children, params, }: Readonly<{ children: React.ReactNode params: Promise<{ lang: 'en' | 'de' }> }>) { return ( <html lang={(await params).lang}>
{children}
@icyJoseph I can fix this issue, could you assign it to me?
Hello @icyJoseph Could you plz check this issue? Or anyone help me to fix this issue? The github bot is closing my issue everytime!!! https://github.com/vercel/next.js/issues/86869 Thanks
I found the cause of this issue. The problem comes from the docs typing
params: Promise<{ lang: 'en' | 'de' }> which does not match the type
Next.js actually generates (params: Promise<{ lang: string }>).
Solution:
- Use Next.js helper type: LayoutProps<'/[lang]'>, or
- Accept
stringand narrow it with a runtime check.
If maintainers approve, I can open a PR to update the docs.
@Typhon0130 the issue gets closes cuz you are not submitting a repository. We likely can't do anything about your issue with that much info. You might want to open a discussion, https://github.com/vercel/next.js/discussions, and see if more people are running into the same problem, possibly find a resolution.
I'll fix the issue w/ this thread.
Hello @icyJoseph I jsut tried the run the project (localhost:3000) in Microsoft Edge Browser. and the page is rendering well when I try to run project in Edge browser, but the page is not rendering when I try to run the project in Chrome Browser. What's wrong?