Next.js Internal Server Error without logs

Hi,

I’m having issues on https://next-multilingual.netlify.app

The deployment works successfully but the homepage returns a 500 internal server error and I cannot find any logs? Am I missing something?

Also oddly enough, other pages are working fine. Example of another page: About Us

Hi @nbouvrette, thanks for the post.

Can you add more information about what you mean by you can’t find any logs?

Also if possible can you share the repository of the site you are trying to deploy for me to help with the debugging.

Thanks.

Yes I mean when I checked in my Netlify project, I check the following real-time logs trying to trigger the error:

  • Functions (all different functions)
  • Edge functions

Maybe there are other logs in Netlify I could see the internal server error?

The original repository is here: GitHub - Avansai/next-multilingual-example: Standalone `next-multilingual` example application.

But it’s really just a base implementation of this library: GitHub - Avansai/next-multilingual: An opinionated end-to-end solution for Next.js applications that requires multiple languages.

If I could have the logs behind the internal server error it would really help me troubleshoot the issue.

Thanks

Hi @nbouvrette, thanks for the extra information.
I took at your repository and then tested it. It deploys as expected.
However I realized the error is coming from the homepage at pages/index.tsx/
Other pages work as expected.

Kindly take your time and then go through your code in pages/index.tsx/. You can narrow down the error by either console.log() expected variables to see if they are actually being returned or start the page as a blank page and add content incrementally to see which additions causes the error.

Let me know the outcome.

Thanks.

Thanks @clarnx - unfortunately this seems like a server-side error and I cannot reproduce it locally. This only happens when deploying on Netlify.

Because this is using a public npm package, I would need to add the logs inside this package and make multiple releases which don’t seem like a great option.

Is there any log on your side you are seeing regarding the internal server error? at least this would give me some sort of pointer because right now I have no idea what is going on.

Thanks

Hi @nbouvrette,
Thanks for the extra feedback.
Kindly try the following suggestions below.

First of all I see that you are using Next.js 13.
Kindly follow the guide in the blog post below to learn how to properly deploy Next.js 13 to Netlify.

warn - You have enabled experimental feature (esmExternals) in next.config.mjs.

Secondly also try to disable experimental features to see if it works. The quoted error above is from the deploy logs.

Finally try to downgrade to Next.js 12 to see if works when all the above fails.

Let me know the outcome after you try the suggested changes above.

Thanks.

Hey @clarnx - the link you sent me is saying that Next.js 13 should work out of the box? On top of this, I am not using the new app directory.

But having said this, downgrading to Next.js 12 would be a lot of work because of the breaking changes on the Link component. (I just tried and stopped that work)

Even if I do this, I suspect it will still have a 500 error, which is why I was looking to understand in the server logs what is this error about?

Are you saying there is no way to get access to these logs?

Thanks

Hi @nbouvrette,

You can access your server side logs by checking the function logs in the Netlify UI dashboard.

In the dashboard click on your site and then at the top menu you should see the functions menu.
Once you click on the functions menu select the function called __netlify-handler
While __netlify-handler is waiting for requests, visit the homepage link where you receive the 500 error.

You will see all the errors displayed in the __netlify-handler logs.

ERROR Error: cannot find the Next.js pages directory

Once of the errors in the functions log is the quoted text above.
Kindly fix the errors in the functions log.

Also if you want to see the errors displayed in your console on local development you need to deploy your site using Netlify CLI.
Kindly find more information in the link below.

Hope this helps.
Let me know the outcome.

Thanks.

1 Like

Did you find this in the logs or you used this as an example?

Because I already checked the __netlify-handler logs and all the other logs I could find on the dashboard, and I tried to trigger them by navigating on the homepage and they are all empty… this is why I was asking for help originally.

Are you able to get the logs for the homepage error on your side?

Thanks

I that the Error: cannot find the Next.js pages directory when looking at the log history… but I was not able to trigger the error by accessing the homepage - it almost looks like a different error?

This error too is a bit odd because it will only be triggered if the pages directory doesn’t exist at one of those locations:

const PAGES_DIRECTORIES = ['pages', 'src/pages']

Those are the only locations allowed by Next.js so I’m not too sure why this error would be triggered?

Hi @nbouvrette,

I cloned your repository and then deployed it. Therefore I see the function error logs from my end when I visit the homepage.

If possible kindly redeploy another version for testing.

Thanks.

@nbouvrette, Even though Next.js 13 is stable, at this point there will be problems if it’s not configured properly since it is was released not long ago.
Also since it fairly new there will be some incompatibility issues for sure. That is why I recommended you use Next.js 12 to see if the problem persists.
Another way to mitigate possible errors is to create a minimal production of your site.

Is there a reason why you are not using the new Next.js 13 app directory?
At this point the errors in the function logs could help.
Also try to deploy on local development with Netlify CLI to see the errors in your terminal or console application.

Thanks.

@clarnx I just released a new version with extra log… and this is kind of odd honestly - I added a directory listing when the error occurs and you can see from the logs, there is no pages directory:

The only reason this would happen is if you are trying to load the Next.js config from some sort of lamda and there is no pages directory in that “instance”?

I don’t think the error here has anything to do with Next.js 13? Currently, there are 2 ways to use Next.js 13:

  • Use the pages directory: this is basically just like Next.js 12 (almost fully backward compatible) - I don’t see how this should impact you - this is how I am using it on my application
  • Use the app directory: this is a completely different way to use Next.js… it’s not ready for production and requires a quasi-entire rebuild which is why we are not using it yet.

Do you know what scenario on your side would spin up a Next.js instance without pages?

Thanks

Good news, I fixed it simply by making the pages check asynchronous… I have no idea what is going on with your instances that don’t have a pages directory so if you have more details I would be happy to learn anything on that front.

Otherwise, thanks for helping me find the logs and a solution!

1 Like

Hi @nbouvrette, glad to know you were able to fix the problem.
Also thanks for sharing how you fixed the problem.