Guides

Quick Module Setup Guide

Last updated by
Harlan Wilton
in chore: drop monorepo docs.

Introduction

Nuxt SEO is a collection of 6 modules, while most will just work-out-of-the-box, there may be some configuration needed depending on your site's requirements.

This guide will give you a quick overview of each module and what you need to do to get started.

Check out the Stackblitz Demo if you want to see a working example.

Sitemap

Generates a sitemap at /sitemap.xml based on your app data sources.

  • When prerendering or using static only routes, no config is needed, it will automatically generate a sitemap for you.
  • If you have dynamic routes, you'll need to set up a handler for Dynamic URLs.

I18n Features

The sitemap module will automatically generate a multi sitemap with each locale having its own sitemap.

See I18n Sitemap for more information.

Robots

Generates a robots.txt at /robots.txt.

Will append a <meta name="robots" content="<rule>"> and a X-Robots HTTP header.

  • If you have any other environments besides development and production, you need to configure the env option. See the Disabling Indexing guide for more information.
  • By default, all routes are allowed for all user-agents. See Disabling Page Indexing to start blocking routes.

I18n Features

Any Disallow rules in the robots module will automatically have the locale prefixes added.

See I18n Robots for more information.

OG Image

Generate dynamic Open Graph images for your pages.

Note: If you don't intend to generate dynamic images, it's recommended to disable this module.

Schema.org

Automatically generates schema.org JSON-LD for your pages.

Checks all links for issues that may be affecting your SEO.

  • When building your site it will check links
  • You can also run it manually by opening the "Link Checker" tab in Nuxt DevTools

SEO Utils

A few extra SEO Nuxt features that don't fit anywhere else.

Shared Configuration

Nuxt Site Config allows you to configure all Nuxt SEO modules at build time and runtime. Allowing you to powerfully configure all modules at runtime, for example in a multi-tenant or i18n app.

It's recommended to set the following config:

  • url - The canonical URL of your site, avoids duplicate content and consolidates page rank.
  • name - The name of your site, used in the title and meta tags.
  • description - The description of your site, used in the meta tags.
  • defaultLocale - The default locale of your site, used in the meta tags. (you can omit this if you're using @nuxtjs/i18n)
nuxt.config.ts
export default defineNuxtConfig({
  site: {
    url: 'https://example.com',
    name: 'Awesome Site',
    description: 'Welcome to my awesome site!',
    defaultLocale: 'en', // not needed if you have @nuxtjs/i18n installed
  }
})

I18n Features

You can dynamically set the site config based on the current locale.

This is useful for setting the url and name properties based on the page the user is currently on.

See I18n Site Config for more information.

Did this page help you?