Sitemap is being generated incorrectly and an error in development also appears when I try to access /sitemap.xml

[gabriel-logan]

Link to the code that reproduces this issue

https://github.com/gabriel-logan/multiform-validator/blob/main/docs/src/app/NOTWORKING_sitemap_copy.ts

https://github.com/gabriel-logan/gabriel-logan/blob/main/docs/src/app/sitemap.ts

To Reproduce

As I said, in development mode, the sitemap gives the following error when I try to access the MY_URL/sitemap.xml route:

And the second problem is that in the production version where the sitemap is generated, it is being generated incorrectly, when I had few routes registered there, it generated ok, but now that there are a lot of routes it is getting buggy.

Showing the print below

https://multiform-validator.3utilities.com/sitemap.xml

Current vs. Expected behavior

I was hoping to be able to access it via /sitemap.xml because I'm not using dynamic routes and on my production site I was expecting it to be correct and it's being wrong.

Provide environment information

OS: Windows, 64bit

PS D:\programas\validadores\multiform-validator\docs> yarn -v
1.22.19
PS D:\programas\validadores\multiform-validator\docs> npm -v
10.8.0
PS D:\programas\validadores\multiform-validator\docs> node -v
v20.12.0
PS D:\programas\validadores\multiform-validator\docs>

  "dependencies": {
    "next": "14.2.3",
    "next-international": "^1.2.4",
    "react": "^18",
    "react-dom": "^18",
    "react-icons": "^5.2.0",
    "react-modern-drawer": "^1.3.1",
    "react-syntax-highlighter": "^15.5.0"
  },

nextconfig

/** @type {import('next').NextConfig} */
const nextConfig = {
    images: {
        unoptimized: true,
        remotePatterns: [
            {
                protocol: "https",
                hostname: "img.shields.io",
                port: "",
                pathname: "**",
            },
            {
                protocol: "https",
                hostname: "badge.fury.io",
                port: "",
                pathname: "**",
            },
            {
                protocol: "https",
                hostname: "cdn.buymeacoffee.com",
                port: "",
                pathname: "**",
            },
        ],
    },
    output: "export",
};

export default nextConfig;

Which area(s) are affected? (Select all that apply)

Not sure, Developer Experience, Metadata, Output (export/standalone)

Which stage(s) are affected? (Select all that apply)

next dev (local), Other (Deployed)

Additional context

I looked for my case in several places and couldn't find it.

[gabriel-logan]

I changed my multiform-validator page to work with ssr, in development mode the error no longer appears, in production a completely wrong sitemap is still generated.

Now I still have a page with the same error that can be put in place for this issue, where the error occurs in dev mode AND in the generation of the sitemap

the new page below:

https://gabriellogan.ddns.net/sitemap.xml

https://github.com/gabriel-logan/gabriel-logan/blob/main/docs/src/app/sitemap.ts

And the multiform-validator is running as ssr and the sitemap is still generated incorrectly: https://multiformvalidator.vercel.app/sitemap.xml

[gabriel-logan]

I'm generating exactly as the documentation says:

[damien-schneider]

+1 Exactly the same issue (I've tried with different versions of NextJS but same result)

[thibault-chausson]

Same issue for me 😢

Edit by maintainer bot: Comment was automatically minimized because it was considered unhelpful. (If you think this was by mistake, let us know). Please only comment if it adds context to the issue. If you want to express that you have the same problem, use the upvote 👍 on the issue description or subscribe to the issue for updates. Thanks!

[junaidalphasquad]

Having same issue with localize sitemap generation

[gabriel-logan]

Yes, still not solved

[thibault-chausson]

The sitemap works. You need to go to your sitemap at localhost:3000/sitemap.xml, right-click to save the page, and open it in a text editor. Alternatively, you can check it in your browser’s console.

[gabriel-logan]

The sitemap works. You need to go to your sitemap at localhost:3000/sitemap.xml, right-click to save the page, and open it in a text editor. Alternatively, you can check it in your browser’s console.

Why is it just texts like in my example and those of my friends above?

[thibault-chausson]

It’s just text in the browser because web browsers do not necessarily handle XML correctly, but you can test it with sitemap validators available online.

[thibault-chausson]

https://github.com/vercel/next.js/issues/66574

[gabriel-logan]

It’s just text in the browser because web browsers do not necessarily handle XML correctly, but you can test it with sitemap validators available online.

So do you ensure that there will be no problem with search systems like google search etc?

[thibault-chausson]

You can check if the sitemap is valid using the Google console or with a site like this : https://www.xml-sitemaps.com/validate-xml-sitemap.html

[trykovyura]

@thibault-chausson Can you provide root cause of issue? Because xml is quite strict format and visual part of xml may not diff. It diff only with alternate attributes generated by nextjs. And it is not valid to check XML format with sitemap validators without requirements.

Problem

• Obvious - generate not valid XML format.
• Sitemap can be txt, but it must name sitemap.txt but it generated under name sitemap.xml

Requirements

• Based on google
• https://developers.google.com/search/docs/crawling-indexing/sitemaps/build-sitemap
• Can be xml, txt or rss
• xml format requirements - https://www.w3schools.com/xml/xml_whatis.asp

Example with alternate

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
    xmlns:news="http://www.google.com/schemas/sitemap-news/0.9"
    xmlns:video="http://www.google.com/schemas/sitemap-video/1.1"
    xmlns:xhtml="http://www.w3.org/1999/xhtml">
  <url>
    <loc>https://www.example.com/english/page.html</loc>
    <!-- Starting with the news extension tags -->
    <news:news>
      <news:publication>
        <news:name>The Example Times</news:name>
        <news:language>en</news:language>
      </news:publication>
      <news:publication_date>2008-12-23</news:publication_date>
      <news:title>Companies A, B in Merger Talks</news:title>
    </news:news>
    <!-- Next we add video extension tags -->
    <video:video>
      <video:thumbnail_loc>https://www.example.com/thumbs/123.jpg</video:thumbnail_loc>
      <video:title>Lizzi is painting the wall</video:title>
      <video:description>
        Gary is watching the paint dry on the wall Lizzi painted.
      </video:description>
      <video:player_loc>
        https://player.example.com/video/987654321
      </video:player_loc>
    </video:video>
    <!-- And finally the xhtml tags for hreflang -->
    <xhtml:link
                rel="alternate"
                hreflang="de"
                href="https://www.example.de/deutsch/page.html"/>
    <xhtml:link
                rel="alternate"
                hreflang="de-ch"
                href="https://www.example.de/schweiz-deutsch/page.html"/>
    <xhtml:link
                rel="alternate"
                hreflang="en"
                href="https://www.example.com/english/page.html"/>
  </url>
<!-- Add more <url> tags -->