Next Js showing index of build folder when using serve

Question

i was trying to run build folder of next js , in react js when i run serve build it works perfectly. but in next js it just shows plain index of files in build folder..

enter image description here

What should i do to get proper results rather than index?

Answer 1

serve only supports serving a static build of a site. So to build a static site in next.js you need to edit your package.json file like that:

"scripts": {
 "build": "next build && next export"
}

Then you can try npm run build to generate the static build in the out folder which you can serve easily via serve out command.

Quoting from nextjs site @ https://nextjs.org/docs/advanced-features/static-html-export :

next export allows you to export your Next.js application to static HTML, which can be run standalone without the need of a Node.js server. It is recommended to only use next export if you don't need any of the unsupported features requiring a server.

Thanks.

• titan: Thanks Sahil , if anyone using this make sure to update loader to akamai in next.config.js
• T30: It gives this error while running the build: next export has been removed in favor of 'output: export' in next.config.js. Learn more: nextjs.org/docs/app/building-your-application/deploying/…