I have built a next.js app. The pages works fine in development env, but if I try to run the production build only the index.js page is loaded properly, all other pages end in a 404.
The npm run build outputs the following:
reating an optimized production build ...
Compiled successfully.
Warning: You have opted-out of Automatic Prerendering due to `getInitialProps` in `pages/_app`.
Read more: https://err.sh/next.js/opt-out-automatic-prerendering
Page Size Files Packages
┌ σ / 66.8 kB 4 27
├ /_app 17.9 kB 0 31
├ /_document
├ /_error 397 B 0 27
├ σ /Products/[specificPage]/Dashboard 404 B 4 27
├ σ /Products/Overview 95.1 kB 9 30
├ σ /Products/Roadmap 475 B 4 27
├ σ /Strategy/Goals 451 B 4 27
└ σ /Strategy/Metrics 459 B 4 27
Therefore I assume that the pages get properly built. This now gets me fairly confused.
From my index.js Page I have a next/link to /strategy/goals which loads for ever if clicked. As said if accessed directly the page is displaying a 404.
EDIT: Also the console only displays Ready on http://localhost:3000 --> not showing any logs regarding building pages, not sure if this should happen in production or only in development.
TLDR: /pages should only contain lower case letters.
(Answered by myself)
The problem was that the folder name and files (/Product/Overview for example) where capitalised which was no problem in test as next directly routed and case was no issue.
Executing the built version, the filesystem of the production environment takes over for routing. Some operating systems (macOS for me)are case sensitive and wont route correctly as the pages are not found.
Fixed by lowercasing everything within the /pages directory.