Using typescript in a Next 13.4 app with Pages router.
Answered
Pacific anchoveta posted this in #help-forum
Pacific anchovetaOP
Hi, everyone.
I'm trying to use a layout.tsx in my Next 13.4 app, using the pages router. However, this is tuning into a nightmare, I'm afraid. My Typescript skills are not the best, and following the docs (https://nextjs.org/docs/pages/building-your-application/routing/pages-and-layouts#with-typescript) I can't get my props from the
It says:
Property 'data' is missing in type '{}' but required in type '{ data: { nextLesson: Lesson; previousLesson: Lesson; nextMatchesData: NextMatchData[]; }; }'.
The contents of the layout.tsx does not show either.
Can anyone help me out?
I'm trying to use a layout.tsx in my Next 13.4 app, using the pages router. However, this is tuning into a nightmare, I'm afraid. My Typescript skills are not the best, and following the docs (https://nextjs.org/docs/pages/building-your-application/routing/pages-and-layouts#with-typescript) I can't get my props from the
getStaticProps function in my index.tsx to work without Typescript complaining, see screenshots. It says:
Property 'data' is missing in type '{}' but required in type '{ data: { nextLesson: Lesson; previousLesson: Lesson; nextMatchesData: NextMatchData[]; }; }'.
The contents of the layout.tsx does not show either.
Can anyone help me out?
Answered by Pacific anchoveta
Jeesus, christ. The error was because I imported useRouter from
So, I got the layout to work by wrapping the Component in _app.tsx. When it comes to the other variant like described in the docs, I have no clue.
next/navgiation and not next/router. Ffs.So, I got the layout to work by wrapping the Component in _app.tsx. When it comes to the other variant like described in the docs, I have no clue.
3 Replies
Pacific anchovetaOP
Pacific anchovetaOP
Actually, if I just wrap the
<Compnent {...pageProps}/> in _app.tsx with the <Layout /> component, the Navbar flashes for a fraction of a second, and then this error (screenshot) occurs.Pacific anchovetaOP
Jeesus, christ. The error was because I imported useRouter from
So, I got the layout to work by wrapping the Component in _app.tsx. When it comes to the other variant like described in the docs, I have no clue.
next/navgiation and not next/router. Ffs.So, I got the layout to work by wrapping the Component in _app.tsx. When it comes to the other variant like described in the docs, I have no clue.
Answer