Understanding Site Config

Every SEO module needs your site URL - sitemaps, OG images, Schema.org identifiers. Site Config lets you set it once instead of duplicating config across modules.

Quick Setup

For most sites, add this to nuxt.config.ts:

export default defineNuxtConfig({
  site: {
    url: 'https://example.com',
    name: 'My Site'
  }
})

That's it. All modules now know your canonical URL and site name.

Available Options

See full config reference for all options.

Environment-Specific Config

Running staging or preview environments? Use environment variables so each deployment gets the right URL:

# .env.staging
NUXT_SITE_URL=https://staging.example.com
NUXT_SITE_ENV=staging

# .env.production
NUXT_SITE_URL=https://example.com
NUXT_SITE_ENV=production

Non-production environments are automatically blocked from indexing.

Reading Site Config

Access your config anywhere with useSiteConfig():

<script setup lang="ts">
const site = useSiteConfig()
// site.url, site.name, site.description, etc.
</script>

Works in components, composables, and server routes.

Multi-Tenancy

Serving multiple domains from one Nuxt app? Site Config handles this:

export default defineNuxtConfig({
  site: {
    multiTenancy: [
      {
        hosts: ['example.com', 'www.example.com'],
        config: { name: 'Example', url: 'https://example.com' }
      },
      {
        hosts: ['foo.com', 'www.foo.com'],
        config: { name: 'Foo', url: 'https://foo.com' }
      }
    ]
  }
})

The correct config loads based on the incoming request hostname.

See the Multi-Tenancy guide for runtime configuration.