Sitemaps in Nuxt

Learn how to create and maintain sitemaps in Nuxt applications.

Introduction

The sitemap.xml file helps search engines discover and understand your site's pages. While not required, it's especially valuable for larger sites and those with frequent content updates.

✅ Good for:

Large sites (100+ pages)
Frequently updated content
Complex site structures
New sites needing faster indexing

Quick Setup

Create a basic sitemap by adding it to your public directory:

public/
  sitemap.xml

Add your URLs:

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
  <url>
    <loc>https://mysite.com/</loc>
    <lastmod>2024-11-03</lastmod>
  </url>
</urlset>

Dynamic Implementation

For sites with changing content, generate the sitemap dynamically:

server/routes/sitemap.xml.ts

export default defineEventHandler(async () => {
// Fetch your dynamic URLs here
  const urls = [
    { url: '/', lastmod: '2024-12-10' },
    { url: '/about', lastmod: '2024-12-15' }
  ]

  return setResponseHeader(event, 'content-type', 'application/xml')`<?xml version="1.0" encoding="UTF-8"?>
 <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
   ${urls.map(page => `
<url>
<loc>https://mysite.com${page.url}</loc>
<lastmod>${page.lastmod}</lastmod>
</url>
`).join('\n')}
</urlset>`
})

Using Nuxt? The Nuxt Sitemap module can handle this automatically.

Sitemap v7.4.8

406

Powerfully flexible XML Sitemaps that integrate seamlessly.

Understanding Sitemaps

The sitemap consists of these key elements:

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
  <url>
    <loc>https://mysite.com/page</loc>
    <lastmod>2024-11-03</lastmod>
    <changefreq>monthly</changefreq>
    <priority>0.8</priority>
  </url>
</urlset>

Elements Explained

loc: The URL of the page (required)
lastmod: When the page was last modified (recommended)
changefreq: How often the page changes (optional)
priority: Relative importance from 0.0 to 1.0 (optional)

Note: Google only uses the lastmod tag - changefreq and priority are ignored.

Important Notes

Limited to 50,000 URLs per sitemap
Must be in UTF-8 encoding
URLs must match canonical URLs exactly
All URLs must be from the same protocol (HTTP/HTTPS)
Absolute URLs required
File size limit of 50MB uncompressed

Common Patterns

Multiple Sitemaps

For sites with over 50,000 URLs, use a sitemap index:

<?xml version="1.0" encoding="UTF-8"?>
<sitemapindex xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
  <sitemap>
    <loc>https://mysite.com/products-sitemap.xml</loc>
    <lastmod>2024-11-03</lastmod>
  </sitemap>
  <sitemap>
    <loc>https://mysite.com/blog-sitemap.xml</loc>
    <lastmod>2024-11-03</lastmod>
  </sitemap>
</sitemapindex>

News Sitemaps

For news sites, use the news namespace:

<?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">
<url>
<loc>https://mysite.com/article</loc>
<news:news>
<news:publication>
<news:name>Site Name</news:name>
<news:language>en</news:language>
</news:publication>
<news:publication_date>2024-11-03T12:00:00+00:00</news:publication_date>
<news:title>Article Title</news:title>
</news:news>
</url>
</urlset>

Image Sitemaps

For image-heavy sites:

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
xmlns:image="http://www.google.com/schemas/sitemap-image/1.1">
<url>
<loc>https://mysite.com/page</loc>
<image:image>
<image:loc>https://mysite.com/image.jpg</image:loc>
<image:title>Image Title</image:title>
</image:image>
</url>
</urlset>