Next.js Discord

Discord Forum

Next Js Static Export Mistakenly saying page is missing `generateStaticParams()`

Answered
Cão de Gado Transmontano posted this in #help-forum
Open in Discord
Avatar
Cão de Gado TransmontanoOP
I'm working through a static export right now and like the documentation (https://nextjs.org/docs/app/api-reference/functions/generate-static-params#static-rendering), I'm trying to return an empty array for generateStaticParams() so my paths can be resolved dynamically. However, I keep getting a build error that says Page "/overview/[param1]/[param2]" is missing "generateStaticParams()" so it cannot be used with "output: export" config.]

My page clearly has this function in it:

export async function generateStaticParams() {
  return []
}


I'm not sure why the build process is saying this page doesn't have the function. Has anyone else run into this?
Answered by B33fb0n3
it can still dynamically come up with new pages?
you can't. When using a static export, all pages are pre build. Any dynamic stuff won't work. And dynamic routes are dynamic.

I have so many parameters
at the end it's an array and it generates all pages that are inside that array. Iirc arrays can also be unlimited big (at least I never reached the maximum). So you might want to do it like it's described in the docs as well (see attached)

why wouldn’t the empty array work?
dynamic stuff in general is not allowed in a static export. Having a dynamic route, that will never be callable (as an empty array means no generated pages) wouldn't be your goal
Image
View full answer

13 Replies

Avatar
B33fb0n3
remove the function and you are good to go
Avatar
Cão de Gado TransmontanoOP
Really? I thought it was required
I removed the function and it's still generating the same build error
Avatar
Cão de Gado TransmontanoOP
I'm looking at the documentation and I noticed the code box that uses the function that returns an empty array has the .js extension only, whereas the files I'm using are .tsx. Is it possible that the empty array function only works with .js?
Avatar
B33fb0n3
No, that won’t make any difference. And no, the function is not required. Remove the function (what you should already did now), delete your .next folder and build again
Avatar
Cão de Gado TransmontanoOP
Still didn't work. Here's a Code Sandbox that replicates the issue I'm having:

https://codesandbox.io/p/devbox/intelligent-lichterman-wjpvwn
Avatar
B33fb0n3
Thanks for sharing. I missed the information that it's a static export. My bad. Then the function is required and it need to be filled with data.

I updated the array with data and it works like expected:
export async function generateStaticParams() {
  return [
    {param1: "string", param2: "string"}
  ];
}
Image
Avatar
Cão de Gado TransmontanoOP
No worries, thanks for clarifying. How can I modify the function so it can still dynamically come up with new pages? I have so many parameters that could fit into both of these slugs that I can’t reasonably generate them all. If you have more insight for that, I’d greatly appreciate it. And as an aside, why wouldn’t the empty array work? Was I misinterpreting the documentation?
Avatar
B33fb0n3
it can still dynamically come up with new pages?
you can't. When using a static export, all pages are pre build. Any dynamic stuff won't work. And dynamic routes are dynamic.

I have so many parameters
at the end it's an array and it generates all pages that are inside that array. Iirc arrays can also be unlimited big (at least I never reached the maximum). So you might want to do it like it's described in the docs as well (see attached)

why wouldn’t the empty array work?
dynamic stuff in general is not allowed in a static export. Having a dynamic route, that will never be callable (as an empty array means no generated pages) wouldn't be your goal
Image
Answer
Avatar
Cão de Gado TransmontanoOP
So would an alternative be to issue a get request for these parameters on page load instead of using slugs? instead of “page/param1/param2” I could do “page?param1=&param2=“ so I can statically generate the page structure but still display different data depending on the parameters?
Avatar
B33fb0n3
as said: when using a static export only static stuff will be supported. Everything that leads to a "dynamic page" on server level will be impossible. So either provide your params inside your generateStaticParams or remove the dynamic route.

Of course you can change mapping however you like:
export async function generateStaticParams() {
  const posts = ...
 
  return posts.map((post) => ({
    param1: post.param1,
    param2: post.param2,
  }))
}

^ this is just an example. You can change it however you need it
Avatar
Cão de Gado TransmontanoOP
Gotcha, thanks for the guidance. I appreciate it :)
Avatar
B33fb0n3
happy to help