how to do static html export with dynamic data fetching in dynamic routes?
Unanswered
Almond stone wasp posted this in #help-forum
Almond stone waspOP
Here is a bit of overview of my problem. Currently I am using a react project scaffolded using vite.js to generate a SPA. This app uses wordpress as headless CMS and the production files are being used as a wordpress theme. This is a blog themed site with multiple pages
Now there are two major issues I am trying to solve by migrating from vite to next.js
1 - SEO improvements to better index the site
2 - Performance boost by serving multiple pages than one huge bundle of javascript at once
From what I reviewed of this migration process, there is one main issue. I want to keep using the static content for my wordpress theme. But when the current app is static exported, it would be impossible to dynamically render each article in a dynamic route. This is the major functionality of the site.
From the [docs](https://nextjs.org/docs/app/building-your-application/deploying/static-exports#unsupported-features),
Is there any workarounds for this?
Thank you in advance!
Now there are two major issues I am trying to solve by migrating from vite to next.js
1 - SEO improvements to better index the site
2 - Performance boost by serving multiple pages than one huge bundle of javascript at once
From what I reviewed of this migration process, there is one main issue. I want to keep using the static content for my wordpress theme. But when the current app is static exported, it would be impossible to dynamically render each article in a dynamic route. This is the major functionality of the site.
From the [docs](https://nextjs.org/docs/app/building-your-application/deploying/static-exports#unsupported-features),
Features that require a Node.js server, or dynamic logic that cannot be computed during the build process, are not supported:
Dynamic Routes withdynamicParams: true
Dynamic Routes withoutgenerateStaticParams()
Is there any workarounds for this?
Thank you in advance!
7 Replies
@joulev Well, you can add dynamic routes with generateStaticParams() *and* export const dynamicParams = false
Almond stone waspOP
noted. When using both combined will the dynamic routes be built only on the build time or available after build file as well?
My apologies if I was unable to word my question properly. 😅
My apologies if I was unable to word my question properly. 😅
@joulev Built only during build time
Almond stone waspOP
I see. That's where I need a workaround since I am using the build files as a custom wordpress theme, I would need the /articles/article-name to be a dynamic one
@Almond stone wasp I see. That's where I need a workaround since I am using the build files as a custom wordpress theme, I would need the /articles/article-name to be a dynamic one
You cannot do anything dynamic with static export. You must choose one: dynamic rendering, or static export
Almond stone waspOP
Hmmm, I see. In that case, just for some specific components, is it possible to use react-router-dom along with next.js?
Whichever router you choose, static is still static and the lack of a running server still makes it impossible to run anything dynamically – not sure how you plan to tackle that with react router