Next.js Discord

Discord Forum

Dynamic routes

Unanswered
Green Heron posted this in #help-forum
Open in Discord
Green HeronOP
I am deploying to vercel and the issue is that when I try to use dynamic routes and reload page inside of a dynamic route it only loads a blank html.

On local it works fine but production does not reload the data of the dynamic route for some reason...

It looks like I have to go to homepage and back into the route again to load the data.


:mild_panic:

31 Replies

Green HeronOP
Also, if I try to deploy to S3 buckets as a static website it does not work...
Green HeronOP
@Rafael Almeida
Original message was deleted
Green HeronOP
I was in another post.
@Rafael Almeida any idea about this issue?
Or what can I do to fix it?
@Green Heron I was in another post.
if you meant https://nextjs-forum.com/post/1142932209326620882, then rafael was only discussing on the question in that post, not the question in this post which are two completely unrelated questions. if they are highly relevant to each other then yes, pinging is allowed, but that's not the case here.
please don't ping people who are not already discussing the question with you
@Eric Burel Check https://nextjs.org/docs/app/building-your-application/deploying/static-exports#unsupported-features
Green HeronOP
Yes, but for some reason next build does not create the HTML files.
$ next build
- info Loaded env from C:\Users\adani\Gametrix\gametrix-ui\.env.local
- info Creating an optimized production build
- info Compiled successfully
- info Linting and checking validity of types
- info Collecting page data
- info Generating static pages (5/5)
- info Finalizing page optimization

Route (app)                                   Size     First Load JS
┌ ○ /                                         4.47 kB         157 kB
├ λ /[game]                                   31.6 kB         144 kB
├ λ /[game]/[profile]                         673 B           102 kB
├ λ /api/[game]/getProfileBy/[username]       0 B                0 B
├ λ /api/[game]/getProfilesListBy/[username]  0 B                0 B
├ ○ /contact                                  1.67 kB         138 kB
â”” â—‹ /favicon.ico                              0 B                0 B
+ First Load JS shared by all                 102 kB
  ├ chunks/596-9e973be57032959f.js            25.8 kB
  ├ chunks/621-d95ea15e4426076e.js            23.4 kB
  ├ chunks/fd9d1056-665ccb1f72c32796.js       50.5 kB
  ├ chunks/main-app-3b0e126cda9af59b.js       214 B
  â”” chunks/webpack-0eba1f0469afe8d5.js        1.78 kB

Route (pages)                                 Size     First Load JS
─ ○ /404                                      182 B          75.8 kB
+ First Load JS shared by all                 75.6 kB
  ├ chunks/framework-8883d1e9be70c3da.js      45 kB
  ├ chunks/main-1399dec2869eccd7.js           28.5 kB
  ├ chunks/pages/_app-52924524f99094ab.js     195 B
  â”” chunks/webpack-0eba1f0469afe8d5.js        1.78 kB

λ  (Server)  server-side renders at runtime (uses getInitialProps or getServerSideProps)
â—‹  (Static)  automatically rendered as static HTML (uses no initial props)
This is what gets outputed:
So fx: game is never exported as html
It's treated as being dynamic, are you using cookies() headers() or anything that would make it dynamic? Try making the page static and see if some errors are fired indicating where you make the page dynamic
"Dynamic Routes without generateStaticParams()" are not allowed
Next.js is not really tailored for this use case of exposing a totally static website
you might prefer to use something like Vite
all the more that you seem to have an API in this app
@Eric Burel "Dynamic Routes without generateStaticParams()" are not allowed
Green HeronOP
I found out why 😂
I am using “use client” because of chakra Ui
And generateStaticParams() doesn’t support client
So I have to switch back to pages
Or use tailwind
It’s good learning tho
You can also split server / client components
Keep you server data loading logic server (without 'use client'), move the rest to a custom component with 'use client'
Green HeronOP
I am trying to make everything with chakra ui navbar etc.
It needs a provider that is wrapped in the layout
So not really much I can split
But pages will do the job
Anyhow component libraries are a lazy way of making a website
So I might have to get my tailwind skills up to date
I wouldn't say it's a lazy way. Tailwind is awesome though
You can find a middle ground between tailwind only & ui libs with [shadcn](https://ui.shadcn.com/) or [nextui](https://nextui.org/)