nuxt-seo

Nuxt SEO

npx nuxi module add @nuxtjs/seo

使用する場面

以下を扱う場合：

• SEO 設定（サイト URL、名前、インデックス登録の可否）
• robots.txt と sitemap.xml の生成
• 動的な OG 画像の生成
• JSON-LD 構造化データ（schema.org）
• パンくずリストと canonical URL

ファイルの読み込み

タスクに応じて、次のリファレンスファイルを読み込んでください：

• references/site-config.md - サイト URL、名前、または SEO の基盤を設定する場合
• references/crawlability.md - robots.txt または sitemap.xml を設定する場合
• references/og-image.md - 動的な OG 画像を生成する場合
• references/schema-org.md - JSON-LD 構造化データを追加する場合
• references/utilities.md - パンくずリスト、canonical URL、またはリンクチェックを扱う場合

すべてのファイルを一度に読み込まないでください。 現在のタスクに関係するものだけを読み込んでください。

サイト設定

すべての SEO モジュールの基盤です。nuxt.config.ts で site を設定し、useSiteConfig() からアクセスします。すべてのオプションについては、references/site-config.md を参照してください。

モジュールの概要

モジュール	目的	主な API
nuxt-site-config	共通設定	useSiteConfig()
@nuxtjs/robots	robots.txt	useRobotsRule()
@nuxtjs/sitemap	sitemap.xml	defineSitemapEventHandler()
nuxt-og-image	OG 画像	defineOgImage()
nuxt-schema-org	JSON-LD	useSchemaOrg()
nuxt-seo-utils	メタデータユーティリティ	useBreadcrumbItems()
nuxt-link-checker	リンク検証	ビルド時チェック

Nuxt Content v3

asSeoCollection() を使うと、フロントマターからサイトマップ、OG 画像、schema.org を自動生成できます：

// 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/**' }))
  }
})

重要： モジュール配列では、@nuxtjs/seo を @nuxt/content より前に読み込んでください：

export default defineNuxtConfig({
  modules: ['@nuxtjs/seo', '@nuxt/content']
})

フロントマターのフィールド：ogImage、sitemap、robots、schemaOrg。

関連スキル

• nuxt-content - SEO フロントマターを使った MDC のレンダリングについて

リンク

• ドキュメント
• GitHub

トークン効率

メインスキル：約250トークン。各サブファイル：約400～600トークン。現在のタスクに関係するファイルだけを読み込んでください。