vite-plugin-sitemap

Automatic sitemap generation for Vite, based on a provided routes object, and optional generation function.

Requirements

This plugin requires an LTS Node version (v8.0.0+).

Install

Using npm:

npm install --save-dev vite-plugin-sitemap

Usage

Note: These examples use typescript files (.ts) but can still be implimented the same way for javascript files (.js).

Create a vite.config.ts configuration file and import the plugin:

import { defineConfig } from 'vite'
import { VitePluginSitemap } from 'vite-plugin-sitemap';

const routes = [
  { path: '/', name: 'Home' },
  { path: '/about', name: 'About' },
  {
    path: '/blog',
    name: 'Blog',
    children: [
        { path: '/article', name: 'Article' }
    ]
  },
];

export default defineConfig({
  plugins: [
    VitePluginSitemap({
      baseUrl: 'https://example.com',
      contentBase: 'public',
      routes: routes,
      urlGenHook: (config) => {
          let updatedRoutes = config.routes;

          /** put any logic here that you want to run before the sitemap.xml file is generated 
           * ex: generate URLs for all of your blog posts
           */

          return updateRoutes;
      }
    })
  ]
});

Options

baseUrl

Type: String Default: null

A string to define what the base URL for the website of the sitemap.

contentBase

Type: String Default: 'public'

This will be the directory in your project where the sitemap.xml file will be generated. Normally this is named either public or dist.

routes

Type: Array[...Object] Default: null

A list of routes with two required properties, path and name. Name is there in case you want to define a route but not make it show up on the sitemap file. See the code above for an example of this value.

urlGenHook

Type: function Default: null Parameters:

• Config: The plugin config object Return value: Route[]

This function is called before the routes object is parsed, allowing you to dynamically add routes during the build step. The function takes the plugin config as an argument, giving you access to existing routes.