Development server compile issues and page routing broken in production builds - Next.js

Question

Hey all so I have an app that I am working on which I am creating using Next.js .

Almost every single time I make a change the server auto compiles with the new changes which are fine. However most of the time the pages just fail to render properly.

Sometimes it takes minutes to render them properly and I have to constantly restart the server manually multiple times just to get the pages to load properly. Does anyone know what could be causing this?

I don't currently have a next.config.js file would I need to create one and add some settings to fix these problems?

And also the page routing does not work in production builds. The index.js page loads fine but none of the routes work when I click on a link they all end in a 404. Even if I type the URL in the browser.

Answer 1

I solved the issue months ago I am just adding the solution I used. It seems to be some sort of git bug maybe some of the files are getting cached somewhere on git or on Netllify which is corrupting it I'm not sure. The only way I managed to it working was to create a brand new git repo and then deploy it to a new site from git on Netlify.

1. Copy the project into a new folder in preparation for setting up a new repo and delete the git file with its history
2. CD into the folder which has the next app (frontend in my case) and delete the node_modules, .next, next.config.js and package-lock.json file
3. Make sure that all of the components in the pages folder are lower case and not camelcase
4. run npm install
5. Setup the new project for git and then deploy it to a NEW git repo. For whatever reason my existing repo fails to get the routing working despite multiple tests and duplicate projects being identical. The only difference was that the new repos I tested only had a master branch whereas my main repo also had a develop branch. And there were only a few commits whereas my main repo had over 80 commits.
6. Deploy to Netlify as a new site from git
7. As my project was in a subfolder called frontend I had to set the base directory to frontend and then run the commands next build && next export

Answer 2

I encounter a similar problem like yours. In dev build all is good , but when it comes to prod build it sort of broke . I suspect it is because of my dependencies of with-iron-session is deprecated but your post is the second post that says make sure the components in the folder pages is in lower case. Is it true about the lowecase components name in pages folder ?