Deploy Next.js with src folder

Hi all

I have an issue deploying a Next.js app. I have followed the guides and installed the next.js plugin and the build is actually working fine, but get “page not found” when trying the URL (https://natural-colors-dev.netlify.app/). I have noticed that the example GitHub - cassidoo/next-netlify-starter: A one-click starter project for Next and Netlify uses the default structure for a next.js app, where I have put the standard folders like pages in to a directory called “src”. I guess that is the issue. But what settings do I need to do to respect this structure?

I don’t really understand your question.

Since your website is password protected, we can’t see it but you say, it’s showing error 404. This happens when you don’t have setup the publish path correctly or you don’t have an index.html in your publish path.

Sorry, forgot about the password, it has been removed now. Locally I do have index.tsx in /src/pages/ so I assume I would see that on the base URL. That works fine locally

index.tsx is not index.html. You need a generated HTML file to publish.

Hey there, @Morten_Ljungberg :wave:

Welcome to the Netlify Forums!

@hrishikesh is right, you need an HTML file to publish. You can read our Support Guide covering this topic here.

Hi and thanks for trying to help out. It might be an issue with my environment variables (returning 404 when page is not found in Contentful). Working on that angle now, but one other thing that I noticed is that I have added a robots.txt to the public folder. Locally that works fine and it renders on localhost:3000/robots.txt. But on the Netlify URL it only works on https://natural-colors-dev.netlify.app/public/robots.txt which to me indicates that the next js engine is not running?

To me, this would mean that your website’s publish path is supposed to be public which might not be configured correctly.

In next.js the public folder is for any static page you want to add, but anything in that folder is served under / (handled by the automatic routing in next.js)

from Next.js by Vercel - The React Framework

"
Next.js can serve static files, like images, under a folder called public in the root directory. Files inside public can then be referenced by your code starting from the base URL ( / ).
"

Anyway, I will try a few things and probably start a different thread if I have more issues, I think the original topic is not the real issue I have

I also encourage you to look at our Netlify blog. There are tons of posts about next.js (all of them are linked here) and some specifically about environment variables.

Good luck!

Thank you, I have been using those :wink:

I found the issue, which was not setting target: “serverless” in next.config.js, which were required to get the plugin to start during deploy.

1 Like