having issue with next/root-params
Unanswered
omar_ab(@om4rAb) posted this in #help-forum
I am learning how to add Internationalization from Nextjs docs and so far I kinda got stuck at where it talks about using next/root-params but I do get this error
The export lang was not found in module [next]/root-params.js [app-rsc] (ecmascript).
The module has no exports at all.
All exports of the module are statically known (It doesn't have dynamic exports). So it's known statically that the requested export doesn't exist.
The export lang was not found in module [next]/root-params.js [app-rsc] (ecmascript).
The module has no exports at all.
All exports of the module are statically known (It doesn't have dynamic exports). So it's known statically that the requested export doesn't exist.
5 Replies
@omar_ab(@om4rAb) I am learning how to add Internationalization from Nextjs docs and so far I kinda got stuck at where it talks about using **next/root-params** but I do get this error
*The export lang was not found in module [next]/root-params.js [app-rsc] (ecmascript).
The module has no exports at all.
All exports of the module are statically known (It doesn't have dynamic exports). So it's known statically that the requested export doesn't exist.*
root params are not the ones that you looking for. You have a dynamic segment (and that’s correct). Then you need to access those dynamic params. You can do so like this:
export default async function Page({
params,
}: {
params: Promise<{ slug: string }>
}) {
const { slug } = await params
return <div>My Post: {slug}</div>
}
change the “slug” to your “lang” and like that you can access it ^^
export default async function Page({
params,
}: {
params: Promise<{ slug: string }>
}) {
const { slug } = await params
return <div>My Post: {slug}</div>
}
change the “slug” to your “lang” and like that you can access it ^^
@B33fb0n3 root params are not the ones that you looking for. You have a dynamic segment (and that’s correct). Then you need to access those dynamic params. You can do so like this:
export default async function Page({
params,
}: {
params: Promise<{ slug: string }>
}) {
const { slug } = await params
return <div>My Post: {slug}</div>
}
change the “slug” to your “lang” and like that you can access it ^^
but then i gotta keep prop drilling down to every component
like they show in this example
to avoid the prop drilling