Tiramisu Docs

Configuration

Learn how to configure Tiramisu Docs using the tiramisu.config.ts file and the Vite plugin.

Configuration Overview

Tiramisu Docs is configured through a single file: src/lib/tiramisu.config.ts. This file defines your site's title, description, sections, sidebar behavior, i18n settings, and more.

The Config File

Use the defineConfig() helper for type-safe configuration:

typescript 
import { defineConfig } from "@tiramisu-docs/kit";

export default defineConfig({
  title: "My Docs",
  description: "Documentation for my project",
  logo: { light: "/logo.svg", dark: "/logo-dark.svg" },
  url: "https://docs.example.com",
  nav: [{ label: "Docs", href: "/docs" }],
  github: {
    repo: "user/repo",
    branch: "main",
    dir: "src/docs",
  },
  sections: [
    { label: "Guide", path: "guide" },
    { label: "API", path: "api" },
  ],
  sidebar: {
    groupOrder: ["Getting Started", "Advanced"],
  },
  instantOg: {
    siteId: "site_xxxxxxxx",
    template: "generic/standard",
  },
  footer: {
    socials: {
      github: "https://github.com/user/repo",
    },
    copyright: "© 2026 My Project",
  },
});

Using Config in Components

To access the resolved config in your Svelte components, use resolveConfig():

typescript 
import { resolveConfig } from "@tiramisu-docs/kit";

const config = resolveConfig(rawConfig);

Vite Plugin

The Vite plugin reads your config to build the virtual module that powers file-based routing and sidebar generation:

typescript 
import config from "./src/lib/tiramisu.config";
import { tiramisuPlugin } from "@tiramisu-docs/kit";

export default defineConfig({
  plugins: [tiramisuPlugin({ config }), sveltekit()],
});