Migrating from pages to app router, multi-tenant static page problem
Unanswered
Snowshoe posted this in #help-forum
SnowshoeOP
I'm refactoring a reasonably large Next app from the pages to app router structure, and getting a weird probelm with static page generation.
It's multi-tenant, with each app being a subdomain, e.g. https://app1.mymaindomain.com, https://app2.mymaindomain.com, and all the pages are dynamically generated from a database.
It works perfectly under the old pages folder, and the static pages are super-fast to load.
It's now working fine from the app folder when running in dev mode locally, and even when built locally.
But when deployed to Vercel, none of the pages are statically rendered, and the index page for each app just shows a raw dump of the page.
I'm using generateStaticParams to generate an array of paths for each page, in the format [{ slugs: [subdomain, pageSlug] }].
The deployed output source (on Vercel) contains a /_sites/ folder which contains each app, e.g. /_sites/app1, /_sites/app2 etc, which sounds correct to me.
within these folders are all the pages for an app (a built static page and an .rsc file).
For the index page, there is an 'index file, but also an index folder which also contains an "index' file and a middleware function.
I've no idea why there is an index folder?
Even with what appears to be static pages, it's slow to render, as if it were dynamic, much slower than when it was running in the pages folder - and the index page is garbage.
Any idea what could be going wrong?
It's multi-tenant, with each app being a subdomain, e.g. https://app1.mymaindomain.com, https://app2.mymaindomain.com, and all the pages are dynamically generated from a database.
It works perfectly under the old pages folder, and the static pages are super-fast to load.
It's now working fine from the app folder when running in dev mode locally, and even when built locally.
But when deployed to Vercel, none of the pages are statically rendered, and the index page for each app just shows a raw dump of the page.
I'm using generateStaticParams to generate an array of paths for each page, in the format [{ slugs: [subdomain, pageSlug] }].
The deployed output source (on Vercel) contains a /_sites/ folder which contains each app, e.g. /_sites/app1, /_sites/app2 etc, which sounds correct to me.
within these folders are all the pages for an app (a built static page and an .rsc file).
For the index page, there is an 'index file, but also an index folder which also contains an "index' file and a middleware function.
I've no idea why there is an index folder?
Even with what appears to be static pages, it's slow to render, as if it were dynamic, much slower than when it was running in the pages folder - and the index page is garbage.
Any idea what could be going wrong?
2 Replies
SnowshoeOP
Update: I've managed to get the index page to display ok, using a slug of "" and the catchall is [[...slugs]], so that's one thing working.
The remaining big issue is that nothing appears statically rendered, even though the static files appear to be in place. You can literally see the page render like as if it is pulling data from a database in real time, although, no such calls appear to be happening according to the browser network tab.
in /app/_sites/[[...slugs]], I have a page.tsx and a pageClient.tsx. page.tsx has "use server" and I'm guessing pageClient also must be "use server", or is Next cleverer than that, as it managed to statically render all pages from the pages folder?
The remaining big issue is that nothing appears statically rendered, even though the static files appear to be in place. You can literally see the page render like as if it is pulling data from a database in real time, although, no such calls appear to be happening according to the browser network tab.
in /app/_sites/[[...slugs]], I have a page.tsx and a pageClient.tsx. page.tsx has "use server" and I'm guessing pageClient also must be "use server", or is Next cleverer than that, as it managed to statically render all pages from the pages folder?
SnowshoeOP
I've seen previous suggestions saying the "index" page slug should be "null, [], undefined or false" to make getStaticProps generate the index page for a route. None of which seem to work for me, but a slug of "" - does work. Any guidance on the correct slug for the index page is welcome too.