Static export with dynamic path param
Answered
Horse guard wasp posted this in #help-forum
Horse guard waspOP
my app is using the App Router,
and my problem is that static exports do not support dynamic routes, like "/dashboard/users/[userId]"
i want to know if it is supported if i change to Pages Router
and my problem is that static exports do not support dynamic routes, like "/dashboard/users/[userId]"
i want to know if it is supported if i change to Pages Router
Answered by B33fb0n3
for pages router it's nearly the same as you see attached. Keep in mind, that nextjs is a fullstack framework, that need to run on a server when it should support all features. If you want something that only runs on the client, then you should use something like plain React
--- Edit
For app router it's discussed here: https://nextjs-forum.com/post/1336839909524246670#message-1337008038036508722
--- Edit
For app router it's discussed here: https://nextjs-forum.com/post/1336839909524246670#message-1337008038036508722
12 Replies
@Horse guard wasp my app is using the App Router,
and my problem is that static exports do not support dynamic routes, like "/dashboard/users/[userId]"
i want to know if it is supported if i change to Pages Router
inside app router, you can use the function [generateStaticParams](https://nextjs.org/docs/app/api-reference/functions/generate-static-params) to generate static path params during build time
@B33fb0n3 inside app router, you can use the function [generateStaticParams](https://nextjs.org/docs/app/api-reference/functions/generate-static-params) to generate static path params during build time
Horse guard waspOP
What is i don't know all combinations like the example i gave for users
@Horse guard wasp What is i don't know all combinations like the example i gave for users
if it's saved on your server for example in a database or similar, then you can read that data and build your routes. Else you can still return an empty array and then the pages will be generated once during runtime and after that served static
Horse guard waspOP
The data can change after build time. Like in the example i gave, there can be a new user added. As for returning an empty array I don't understand what that does or what you mean
@Horse guard wasp The data can change after build time. Like in the example i gave, there can be a new user added. As for returning an empty array I don't understand what that does or what you mean
!
An empty array means, that the page will be generated during runtime once. So no pages are build during build time (as empty array), but generated when they are first visited.
When data changes, you can use the revalidatePath to also revalidate the data on a specific page
An empty array means, that the page will be generated during runtime once. So no pages are build during build time (as empty array), but generated when they are first visited.
When data changes, you can use the revalidatePath to also revalidate the data on a specific page
@B33fb0n3 !
An empty array means, that the page will be generated during **runtime** *once*. So no pages are build during build time (as empty array), but generated when they are first visited.
When data changes, you can use the revalidatePath to also revalidate the data on a specific page
Horse guard waspOP
I need to use static exports, runtime generation and revalidate path are not available and require server no?
@Horse guard wasp I need to use static exports, runtime generation and revalidate path are not available and require server no?
yes, all of those things require a server. If you want a fully static export that can run without a server, you can do that by adding it to your nextConfig:
Keep in mind, that dynamic routes without using generateStaticParams won't work.
const nextConfig = {
output: 'export',
}Keep in mind, that dynamic routes without using generateStaticParams won't work.
@B33fb0n3 yes, all of those things require a server. If you want a fully static export that can run without a server, you can do that by adding it to your nextConfig:
tsx
const nextConfig = {
output: 'export',
}
Keep in mind, that dynamic routes without using generateStaticParams won't work.
Horse guard waspOP
I'm aware of that for the app router. I learned the hard way after finishing the app and then getting an error because I'm using dynamic paths with static export. I want to know if pages router supports this very basic feature or will i have to use something other than next js
@Horse guard wasp I'm aware of that for the app router. I learned the hard way after finishing the app and then getting an error because I'm using dynamic paths with static export. I want to know if pages router supports this very basic feature or will i have to use something other than next js
for pages router it's nearly the same as you see attached. Keep in mind, that nextjs is a fullstack framework, that need to run on a server when it should support all features. If you want something that only runs on the client, then you should use something like plain React
--- Edit
For app router it's discussed here: https://nextjs-forum.com/post/1336839909524246670#message-1337008038036508722
--- Edit
For app router it's discussed here: https://nextjs-forum.com/post/1336839909524246670#message-1337008038036508722
Answer
sure thing