Automatically generate or serve dynamic sitemap.xml for Nuxt.js projects!
- Module based on the awesome sitemap.js package ❤️
- Automatically add the static routes to the sitemap
- Works with all modes (universal, spa, generate)
- For Nuxt 1.x and higher
-
Add the
@nuxtjs/sitemapdependency withyarnornpmto your project. -
Add
@nuxtjs/sitemapto themodulessection ofnuxt.config.js:
modules: [
'@nuxtjs/sitemap'
]notice: If you use other modules (eg.
nuxt-i18n), always declare the sitemap module at end of array (eg.modules: ['nuxt-i18n', '@nuxtjs/sitemap'])
- Configure it:
{
modules: [
'@nuxtjs/sitemap'
],
sitemap: {
hostname: 'https://example.com',
gzip: true,
exclude: [
'/secret',
'/admin/**'
],
routes: [
'/page/1',
{
url: '/page/2',
changefreq: 'daily',
priority: 1,
lastmodISO: '2017-06-30T13:30:00.000Z'
}
]
}- Default:
[]orgenerate.routesvalue from yournuxt.config.js
The routes parameter follows the same way than the generate configuration.
See as well the routes examples below.
- Default:
/sitemap.xml
The URL path of the generated sitemap.
- Default:
sitemap.hostnamevalue from yournuxt.config.jsbuild.publicPathvalue from yournuxt.config.jsos.hostname()for generate or spa mode, or dynamically based on request URL (headers.host) for universal mode
This value is mandatory for generation sitemap file, and you should explicitly provide it for generate or spa mode.
- Default:
1000 * 60 * 15(15 Minutes)
Defines how frequently should sitemap routes being updated.
Please note that after each invalidation, routes will be evaluated again. (See routes section)
- Default:
[]
The exclude parameter is an array of glob patterns to exclude static routes from the generated sitemap.
- Default:
undefined
If filter option is set as a function, all routes will be filtered through it.
Examples:
// nuxt.config.js
// Filter routes by language
{
sitemap: {
filter ({ routes, options }) {
if (options.hostname === 'example.com') {
return routes.filter(route => route.locale === 'en')
}
return routes.filter(route => route.locale === 'fr')
}
}
}
// Add a trailing slash to each route
{
sitemap: {
filter ({ routes }) {
return routes.map(route => route.url = `${route.url}/`)
}
}
}- Default:
false
Enable the creation of the .xml.gz sitemap compressed with gzip.
- Default:
undefined
Set the XML namespaces by override all default xmlns attributes in <urlset> element.
// nuxt.config.js
{
sitemap: {
xmlNs: 'xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"'
}
}- Default:
undefined
The URL path of the XSL file to style the sitemap.
- Default:
{}
The defaults parameter set the default options for all routes.
// nuxt.config.js
{
sitemap: {
defaults: {
changefreq: 'daily',
priority: 1,
lastmod: new Date(),
lastmodrealtime: true
}
}
}See available options: https://github.com/ekalinin/sitemap.js#usage
By default, the dynamic routes are ignored by the sitemap module.
Nuxt cannot automatically provide this type of complex routes.
Example:
-| pages/
---| index.vue --> static route
---| about.vue --> static route
---| users/
-----| _id.vue --> dynamic route
If you want the module to add any route with dynamic parameters, you have to set an array of dynamic routes.
eg. add routes for /users/:id in the configuration:
// nuxt.config.js
{
sitemap: {
routes: [
'/users/1',
'/users/2',
'/users/3'
]
}
}// nuxt.config.js
const axios = require('axios')
{
sitemap: {
routes () {
return axios.get('https://jsonplaceholder.typicode.com/users')
.then(res => res.data.map(user => '/users/' + user.username))
}
}
}This feature is deprecated. Use a promise-based approach instead.
// nuxt.config.js
const axios = require('axios')
{
sitemap: {
routes (callback) {
axios.get('https://jsonplaceholder.typicode.com/users')
.then(res => {
let routes = res.data.map(user => '/users/' + user.username)
callback(null, routes)
})
.catch(callback)
}
}
}