Configuration

For the most part you should not have to create a project specific configuration for you docs. If you do, the following documents all of the available options.

Configuration File

ignite uses cosmiconfig to load its configuration file. We support all formats that the default cosmiconfig configuration supports.

The two most commons ways to configure ignite is either through a json .igniterc at the root of your project:

{
  "name": "My Project"
}
{
  "name": "My Project"
}

or if you're project is in JavaScript, directly in the package.json:

{
  "name": "npm-package",
  "ignite": {
    "name": "My Project"
  }
}
{
  "name": "npm-package",
  "ignite": {
    "name": "My Project"
  }
}

Options

Repo

The repo that contains your project. This can be a short slug if on public GitHub.

{
  "repo": "hipstersmoothie/my-repo"
}
{
  "repo": "hipstersmoothie/my-repo"
}

Name

The name of your project. This value is used in multiple places in the docs.

{
  "name": "My Project"
}
{
  "name": "My Project"
}

URL

The url you will be deploying to.

{
  "basePath": "https://my.com/pages/your-project"
}
{
  "basePath": "https://my.com/pages/your-project"
}

Order

Control the order of the top level section in the navbar. Each item in the array should be a name of one of your top-level documentation folders. Any unordered sections will be put after your provided order in alphabetical order.

{
  // The Default
  "order": ["docs", "blog"]
}
{
  // The Default
  "order": ["docs", "blog"]
}

HTML Urls

Add .html to the end of each internal URL.

{
  "htmlUrls": true
}
{
  "htmlUrls": true
}

PurgeCSS

By default next-ignite will purge CSS it doesn't use.

You can turn off this behavior:

{
  "purge": false
}
{
  "purge": false
}

Remark and ReHype Plugins.

You can provide plugins for the underlying markdown and html libraries we use to add more features.

NOTE: You can only specify these plugins in a JavaScript based configuration

const toc = require("rehype-toc");
const withIgnite = require("next-ignite/next")({
  // your ignite options
  rehypePlugins: [toc],
});

module.exports = withIgnite();
const toc = require("rehype-toc");
const withIgnite = require("next-ignite/next")({
  // your ignite options
  rehypePlugins: [toc],
});

module.exports = withIgnite();

Syntax Theme

You can change the theme for syntax highlighting in both light and dark mode.

See supported themes;

{
  "lightSyntaxTheme": "light-plus",
  "darkSyntaxTheme": "dark-plus"
}
{
  "lightSyntaxTheme": "light-plus",
  "darkSyntaxTheme": "dark-plus"
}

You can also specify the theme as a path:

{
  "lightSyntaxTheme": "./my-custom-theme.json"
}
{
  "lightSyntaxTheme": "./my-custom-theme.json"
}

or as JSON:

{
  "lightSyntaxTheme": {
    // Theming values
  }
}
{
  "lightSyntaxTheme": {
    // Theming values
  }
}

Files

docs/public/logo.png

The logo for your project.

docs/public/logo-dark.png

The logo for your project when the OS is in dark mode.

docs/public/images/favicon.*

The favicon for your project.

docs/public/images/favicon-dark.*

The favicon for your project when the OS is in dark mode.