Configuration

This guide will help you configure renoun in your project.

renoun.json

The renoun.json file is used to globally configure components and utilities and override defaults for the entire workspace.

This file should be placed in the root of your workspace. Here is an example configuration:

{
  // Provide a schema for the configuration file to enable intellisense
  "$schema": "https://renoun.dev/schema.json",

  // Specify the theme to use for code highlighting
  "theme": "theme.json",

  // Specify the languages to load for code highlighting
  "languages": ["sh", "ts", "tsx"],

  // Specify the git information for edit links
  "git": {
    "source": "https://github.com/souporserious/renoun"
  },

  // Specify the site URL for the canonical URL
  "siteUrl": "https://renoun.dev"
}

Themes

Themes are powered by Shiki and specify how source code is highlighted in the CodeBlock and CodeInline components. You can use a bundled theme or create your own theme. The default theme is set to nord.

Bundled Themes

To use a bundled theme, you can reference a valid theme by name:

{
  "theme": "nord"
}

Custom Themes

To use a custom theme, you can reference a JSON file that defines a VS Code compatible theme:

{
  "theme": "theme.json"
}

Languages

The languages property is used to define the languages that are supported by the CodeBlock and CodeInline components. This is used to determine which language to load when highlighting code.

The following list is the default languages loaded by renoun:

{
  "languages": [
    "css",
    "js",
    "jsx",
    "ts",
    "tsx",
    "md",
    "mdx",
    "sh",
    "json",
    "html"
  ]
}

Overriding this property will replace the default languages with the provided list.

Git Information

Git can be used to set the source, branch, and provider of your documentation site. This is used to generate the canonical URL for each page:

{
  "git": {
    "source": "https://github.com/souporserious/renoun",
    "branch": "main",
    "provider": "github"
  }
}

Site URL

The siteUrl property is used to define the URL of your documentation site. This is used to generate the canonical URL for each page:

{
  "siteUrl": "https://renoun.dev"
}