Describe your question/issue in detail
Hello, I'm currently migrating a project from Gatsby to Next.js (Pages Router). The challenge arose around the topic of routing, as currently it's based on the slug
field of a page
type. This slug can take a form of a simple one like /lorem
, but also nested like /lorem/ipsum
. So, instead of going the uid
route as presented in the documentation, I've implemented generating static paths and pages based on that page.slug
field by utlizing filters and it's working well.
The problem starts with setting Prismic page routing. I'm unable to set it up properly, whether with a routes object or with a link resolver.
Impacted feature
PrismicNextLink
s are broken.
What steps have you taken to resolve this issue already?
1. Setting up routes object
I've tried adding this to page routes:
{
type: 'page',
resolvers: {
slug: 'page.slug'
},
path: '/:slug',
}
It results with this error that I just can't understand:
Error: [Link resolver error] Invalid resolver slug
It must be a content relationship linked to one and only one custom typ
2. Creating a custom link resolver
I thought that maybe it's not possible to get the page as self in the page route, as the documentation states the resolver is for parents and grandparents. I went for the more advanced use case with link resolver. I've created it like this:
const linkResolver = (doc) => {
switch (doc.type) {
case 'page':
return doc.data.slug || null;
default:
return null;
}
};
The new problem is that doc
doesn't have a data
key for some reason. In the current Gatsby implementation, it works properly with page.slug
being defined in Gatsby plugin config in fetchLinks
array.
TypeError: Cannot read properties of undefined (reading 'slug')
Prismic client, when pulling the page in getStaticProps
, uses fetchLinks
with page.slug
in it, but it makes no difference.
Your Role
Software engineer
Hosting provider
Netlify