How to add sitemap in Next.js without using any npm packages?

Question

I have added my sitemap to the Next.js pages folder by creating a new file called sitemap.xml.

But when I try to access my sitemap by using the http://localhost:3000/sitemap.xml it throws a 404 page not found error. I need to add my sitemap file URL to Google Search Console. So how am I solving this problem or has any different method to add sitemap.xml in Next.js?

sitemap.xml

Next.js Pages Folder:

Answer 1

Files added under the pages folder are expected to be JavaScript/TypeScript files with the code necessary to generate a page.

To statically serve your sitemap.xml file, you should move it to the public folder instead.

From the Static File Serving documentation:

Next.js can serve static files, like images, under a folder called public in the root directory.

(...) This folder is also useful for robots.txt, favicon.ico, Google Site Verification, and any other static files (including .html)!