Next.js slug conflict: getStaticPaths returning duplicate paths with static page
Conflicting paths returned from getStaticPaths, paths must unique per page.export const getStaticPaths = async () => {
const paths = await sanityClient.fetch(currentPage);
return {
paths,
fallback: false
};
};
export const getStaticProps = async ({ params }) => {
const { slug } = params;
const page = await sanityClient.fetch(pageQuery, { slug });
return { props: { data: { page }, preview: true } };
};export const getStaticProps = async () => {
const data = await sanityClient.fetch(` {
"page": ${pagePeopleQuery},
"friends": ${friendsQuery},
}`);
return { props: { data } };
};The issue you're encountering is a common Next.js routing conflict. When you have both [slug].js (a dynamic catch-all route) and people.js (a static route) in the same pages folder, Next.js is complaining because your getStaticPaths in [slug].js is likely returning a path that includes "people" as one of the slugs.
Here's what's happening: if your Sanity query in [slug].js returns documents that include one with a slug of "people", Next.js sees two routes trying to handle /people - both the dynamic [slug].js route and the static people.js file. This creates the "paths must unique per page" error.
Solutions:
- Filter out conflicting slugs in getStaticPaths (recommended):
// [slug].js
export const getStaticPaths = async () => {
const paths = await sanityClient.fetch(currentPage);
// Filter out any paths that conflict with static pages
const filteredPaths = paths.filter(path => {
const slug = path.params?.slug || path.slug;
return slug !== 'people'; // Add other static page slugs here
});
return {
paths: filteredPaths,
fallback: false
};
};Restructure your routes: Move
people.jsinto a subfolder or rename it to avoid conflicts. For example, create a/team/people.jsroute instead.Consolidate into the dynamic route: Remove
people.jsentirely and handle it through your[slug].jsby creating a "people" document in Sanity with the appropriate content type.
Additional note about your path format: Make sure your currentPage query returns paths in the correct format. The paths array should look like:
paths: [
{ params: { slug: 'about' } },
{ params: { slug: 'contact' } },
// etc.
]If your query is returning slugs directly as strings, you'll need to map them:
const slugs = await sanityClient.fetch(currentPage);
const paths = slugs.map(slug => ({ params: { slug } }));The first solution (filtering) is typically the cleanest approach when you have a mix of static and dynamic pages. Just make sure to exclude any slug values that match your static page filenames.
Show original thread18 replies
Was this answer helpful?
Sanity – Build the way you think, not the way your CMS thinks
Sanity is the developer-first content operating system that gives you complete control. Schema-as-code, GROQ queries, and real-time APIs mean no more workarounds or waiting for deployments. Free to start, scale as you grow.