App Config

Full app.config.ts shape and override examples.

Overview

Foundry uses Nuxt's app.config.ts for client-side configuration. The layer provides defaults that your app can override using defu deep merge.

Full Config Shape

// app.config.ts
export default defineAppConfig({
  // Content route mapping — maps URL prefixes to collection names
  content: {
    routeMap: {
      '/': 'pages',
      '/docs': 'docs',
      '/changelog': 'changelog',
    },
    searchable: ['pages', 'docs'], // Collections indexed for search
    defaultAuthor: 'Team', // Fallback author name
    routing: {
      sources: '/sources',
      offers: '/offers',
      success: '/success',
    },
  },

  // SEO defaults
  seo: {
    titleTemplate: '%s - My Site',
    title: 'My Site',
    description: 'Site description',
  },

  // Branding
  logo: {
    light: '/logo-light.svg',
    dark: '/logo-dark.svg',
    alt: 'My Site',
  },
  header: {
    title: 'My Site',
  },
  socials: {
    github: 'https://github.com/myorg',
    twitter: 'https://twitter.com/myorg',
    // Any key → value pairs
  },

  // Table of contents (docs layout)
  toc: {
    title: 'On this page',
    bottom: {
      title: 'Resources',
      links: [
        {
          icon: 'i-lucide-book-open',
          label: 'Documentation',
          to: '/docs',
          target: '_self',
        },
      ],
    },
  },

  // GitHub integration (false to disable)
  github: {
    owner: 'myorg',
    name: 'myrepo',
    url: 'https://github.com/myorg/myrepo',
    branch: 'main',
    rootDir: '', // Monorepo subdirectory
  },

  // UI theme overrides
  ui: {
    colors: {
      primary: 'blue',
      secondary: 'slate',
      neutral: 'zinc',
      success: 'emerald',
      warning: 'amber',
      error: 'red',
      info: 'sky',
    },
    icons: {
      search: 'i-lucide-search',
      close: 'i-lucide-x',
      check: 'i-lucide-check',
      // 40+ icon mappings available
    },
  },
})

Route Map Config

The content.routeMap object maps URL prefixes to collection names. Each key is a URL prefix and each value is the collection name from content.config.ts:

// { '/prefix': 'collectionName' }
routeMap: {
  '/': 'pages',
  '/docs': 'docs',
  '/changelog': 'changelog',
}

The useContentConfig() composable uses this mapping at runtime to resolve routes to collections. See Composables Reference.

Overriding in Your App

Your app's app.config.ts merges with layer defaults via defu:

app.config.ts
export default defineAppConfig({
  // Only specify what you want to change
  seo: {
    titleTemplate: '%s | Acme',
    title: 'Acme',
    description: 'Validate your SaaS idea in a weekend',
  },
  logo: {
    light: '/acme-light.svg',
    dark: '/acme-dark.svg',
    alt: 'Acme',
  },
  header: {
    title: 'Acme',
  },
  socials: {
    github: 'https://github.com/acme',
    twitter: 'https://twitter.com/acme',
  },
  content: {
    searchable: ['pages', 'docs'],
  },
})

Unspecified fields keep their layer defaults.

Custom Collection Names

If your app uses different collection names (e.g., a non-English site):

app.config.ts
export default defineAppConfig({
  content: {
    routeMap: {
      '/darksky': 'darksky',
    },
  },
})

This remaps all internal references — navigation, search, routing — to use darksky instead of docs.

Disabling GitHub Integration

Set github to false to disable "Edit on GitHub" links in docs:

app.config.ts
export default defineAppConfig({
  github: false,
})

UI Colors

Colors use Nuxt UI's design tokens built on oklch. Override any semantic color:

app.config.ts
export default defineAppConfig({
  ui: {
    colors: {
      primary: 'emerald',
      secondary: 'stone',
    },
  },
})

See Theming > Colors for the full color system.