nuxt-seo
onmax/nuxt-skills
Nuxt SEO meta-module for robots.txt, sitemaps, OG images, and structured data.
What is nuxt-seo?
A comprehensive Nuxt module that handles SEO configuration, robots.txt and sitemap generation, dynamic OG image creation, and JSON-LD structured data. Use it when setting up SEO foundations, generating search-engine metadata, or adding rich content previews to your Nuxt site.
- Configure site-wide SEO settings (URL, name, indexability) via nuxt-site-config
- Generate robots.txt and sitemap.xml automatically with customizable rules
- Create dynamic Open Graph images for social sharing
- Add JSON-LD structured data (schema.org) for rich snippets
- Generate breadcrumbs and canonical URLs
- Validate internal links at build time
How to install nuxt-seo
npx skills add https://github.com/onmax/nuxt-skills --skill nuxt-seo- Nuxt 3 project
- @nuxtjs/seo module installed via `npx nuxi module add @nuxtjs/seo`
How to use nuxt-seo
- 1.Install the module: `npx nuxi module add @nuxtjs/seo`
- 2.Configure site settings in `nuxt.config.ts` under the `site` property
- 3.Load relevant reference files based on your task (site-config, crawlability, og-image, schema-org, or utilities)
- 4.Use composables like `useSiteConfig()`, `useRobotsRule()`, `defineOgImage()`, or `useSchemaOrg()` in your pages/components
- 5.For Nuxt Content v3, use `asSeoCollection()` to automatically apply SEO metadata from frontmatter
Use cases
- Setting up SEO configuration and site metadata for a new Nuxt project
- Generating dynamic OG images for blog posts or product pages
- Creating structured data (schema.org) for e-commerce or article content
- Automating sitemap and robots.txt generation for search engine crawling
- Integrating SEO metadata from Nuxt Content v3 frontmatter automatically
- Nuxt developers building SEO-critical sites
- Content creators using Nuxt Content for blogs or documentation
- E-commerce teams needing structured product data
- Teams automating search engine optimization workflows
nuxt-seo FAQ
No. Load only the files relevant to your current task to keep token usage efficient. Each sub-file is 400–600 tokens.
Use `asSeoCollection()` in your content.config.ts to automatically generate sitemaps, OG images, and structured data from frontmatter. Ensure @nuxtjs/seo is loaded before @nuxt/content in the modules array.
Key composables include `useSiteConfig()` for site config, `useRobotsRule()` for robots rules, `defineOgImage()` for OG images, `useSchemaOrg()` for JSON-LD, and `useBreadcrumbItems()` for breadcrumbs.
Yes. Use `useRobotsRule()` and `defineSitemapEventHandler()` to customize rules and entries dynamically.
Yes. The nuxt-link-checker module included performs build-time validation of internal links.
Full instructions (SKILL.md)
Source of truth, from onmax/nuxt-skills.
name: nuxt-seo description: Nuxt SEO meta-module with robots, sitemap, og-image, schema-org. Use when configuring SEO, generating sitemaps, creating OG images, or adding structured data. license: MIT
Nuxt SEO
npx nuxi module add @nuxtjs/seo
When to Use
Working with:
- SEO configuration (site URL, name, indexability)
- Robots.txt and sitemap.xml generation
- Dynamic OG image generation
- JSON-LD structured data (schema.org)
- Breadcrumbs and canonical URLs
Loading Files
Consider loading these reference files based on your task:
- references/site-config.md - if configuring site URL, name, or SEO foundation
- references/crawlability.md - if setting up robots.txt or sitemap.xml
- references/og-image.md - if generating dynamic OG images
- references/schema-org.md - if adding JSON-LD structured data
- references/utilities.md - if working with breadcrumbs, canonical URLs, or link checking
DO NOT load all files at once. Load only what's relevant to your current task.
Site Config
Foundation for all SEO modules. Configure site in nuxt.config.ts, access via useSiteConfig(). See references/site-config.md for full options.
Module Overview
| Module | Purpose | Key API |
|---|---|---|
| nuxt-site-config | Shared config | useSiteConfig() |
| @nuxtjs/robots | robots.txt | useRobotsRule() |
| @nuxtjs/sitemap | sitemap.xml | defineSitemapEventHandler() |
| nuxt-og-image | OG images | defineOgImage() |
| nuxt-schema-org | JSON-LD | useSchemaOrg() |
| nuxt-seo-utils | Meta utilities | useBreadcrumbItems() |
| nuxt-link-checker | Link validation | Build-time checks |
Nuxt Content v3
Use asSeoCollection() for automatic sitemap, og-image, and schema-org from frontmatter:
// content.config.ts
import { defineCollection, defineContentConfig } from '@nuxt/content'
import { asSeoCollection } from '@nuxtjs/seo/content'
export default defineContentConfig({
collections: {
posts: defineCollection(asSeoCollection({ type: 'page', source: 'posts/**' }))
}
})
Important: Load @nuxtjs/seo before @nuxt/content in modules array:
export default defineNuxtConfig({
modules: ['@nuxtjs/seo', '@nuxt/content']
})
Frontmatter fields: ogImage, sitemap, robots, schemaOrg.
Related Skills
- nuxt-content - For MDC rendering with SEO frontmatter
Links
Token Efficiency
Main skill: ~250 tokens. Each sub-file: ~400-600 tokens. Only load files relevant to current task.
Related skills
More from onmax/nuxt-skills and the wider catalog.

nuxt-studio
Configure and operate self-hosted Nuxt Studio editor for Nuxt Content projects.

nuxthub
Full-stack Nuxt with type-safe database, KV, blob storage, and cache—multi-cloud ready.

pnpm
Manage Node.js dependencies with pnpm—monorepos, workspaces, catalogs, and supply chain security.

reka-ui
Unstyled, accessible Vue 3 component primitives with WAI-ARIA compliance and composition patterns.

tresjs
Use when building 3D scenes with TresJS (Vue Three.js) - provides TresCanvas, composables (useTres, useLoop), Cientos helpers (OrbitControls, useGLTF, Environment), and post-processing effects

ts-library
Author TypeScript libraries with dual CJS/ESM, type-safe APIs, and modern build tooling.