question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Catch-all routes and SSG

See original GitHub issue

@dpfavand in that case you’ll want to use a catch-all route: https://nextjs.org/blog/next-9-2#catch-all-dynamic-routes

Potentially we can warn when you try to return a path including slashes, but the behavior is correct when using [slug].js, in your case you want [...slug].js.

@timneutkens thanks for the follow-up. I’ve tried two methods without success. Basically when specifying the slug value as a string in getStaticPaths, it isn’t passed through to getStaticProps at all. When returning the slug value as an array, the build fails as the value must be a string.

Case 1, Assuming a file pages/[...slug].jsx, slug as string:

export async function unstable_getStaticPaths() {
	return [{ params: { slug: 'en/about' } }];
}

export async function unstable_getStaticProps({ params }) {
	console.log('params', params);
	return { slug: params.slug };
}

In the above case, params in getStaticProps is an empty object - no slug key.

Case 2, pages/[...slug].jsx, slug as array,

export async function unstable_getStaticPaths() {
	const allPaths = Object.keys(pathMap).map(slug => ({ params: { slug } }));
	return [{ params: { slug: ['en', 'about'] } }];
}
export async function unstable_getStaticProps({ params }) {
	console.log('params', params);
	return { slug: params.slug };
}

In case 2, the build fails with

> Build error occurred
{ Error: A required parameter (slug) was not provided as a string.
    at _validParamKeys.forEach.validParamKey (/project/node_modules/next/dist/build/utils.js:21:569)
    at Array.forEach (<anonymous>)
    at toPrerender.forEach.entry (/project/node_modules/next/dist/build/utils.js:21:495)
    at Array.forEach (<anonymous>)
    at Object.isPageStatic (/project/node_modules/next/dist/build/utils.js:17:122)
    at process._tickCallback (internal/process/next_tick.js:68:7) type: 'Error' }

_Originally posted by @dpfavand in https://github.com/zeit/next.js/issues/9524#issuecomment-576344026_

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:5 (1 by maintainers)

github_iconTop GitHub Comments

3reactions
eagorcommented, Apr 8, 2020

I’m having similar issue today. In development it runs well, but when building production. In my catch-all-routes component that I generate static paths for, the router.query object is empty on first run.

1reaction
egemoncommented, Aug 19, 2020

Having similar issue as @eagor described, but without catch-all-routes

Read more comments on GitHub >

github_iconTop Results From Across the Web

Next.js Tutorial - 9 - Catch All Routes - YouTube
Courses - https://learn.codevolution.dev/⚡️ Checkout Taskade! https://www.taskade.com/ Support UPI - https://support.codevolution.dev/  ...
Read more >
Catchall Routes that mix SSG and SSR - reactjs - Stack Overflow
I was wondering if there's a way to use getServerSideProps in this mix too so that my dynamic queries can be rendered on...
Read more >
conflicting-ssg-paths - Next.js
In your getStaticPaths function for one of your pages you returned conflicting paths. All page paths must be unique and duplicates are not...
Read more >
Implementing SSR in Next.js: Dynamic routing and prefetching
js attempts to solve this problem by allowing you to choose between SSG and SSR for each page of your application. This post...
Read more >
Routing - Astro Documentation
An intro to routing with Astro. ... Astro uses file-based routing to generate your build URLs based on the file layout of your...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found