Skip to main content

Installation

  1. Install redocusaurus:

    npm

    npm i --save redocusaurus
    # OR
    yarn add redocusaurus
  2. Add it as a preset to your docusaurus config along with @docusaurus/preset-classic and pass the following options:

    • Pass the path to the local OpenAPI YAML file.

      // docusaurus.config.js

      module.exports = {
      // ...
      presets: [
      // .. Your other presets' config
      '@docusaurus/preset-classic',
      [
      'redocusaurus',
      {
      // Plugin Options for loading OpenAPI files
      specs: [
      {
      spec: 'openapi/openapi.yaml',
      route: '/api/',
      },
      ],
      // Theme Options for modifying how redoc renders them
      theme: {
      // Change with your site colors
      primaryColor: '#1890ff',
      },
      },
      ],
      ],
      // ...
      };
    • Pass the URL for the OpenAPI spec.

      // docusaurus.config.js

      module.exports = {
      // ...
      presets: [
      // .. Your other presets' config
      '@docusaurus/preset-classic',
      // Redocusaurus config
      [
      'redocusaurus',
      {
      // Plugin Options for loading OpenAPI files
      specs: [
      {
      spec: 'https://redocly.github.io/redoc/openapi.yaml',
      route: '/api/',
      },
      ],
      // Theme Options for modifying how redoc renders them
      theme: {
      // Change with your site colors
      primaryColor: '#1890ff',
      },
      },
      ],
      ],
      // ...
      };

The API Doc will be available at the path specific by route. To skip adding a route altogether just don't set the route property. You will still be able to reference schema elements manually using Schema Imports or create Custom React Pages using the data and theme components. If you have a redocly.yaml it will be loaded automatically.

Options

specs

An array of plugin options, see plugin options for individual option details.

theme

Pass options to customize the theme, see theme options for individual option details.

config (optional)

type: string

Redocly config to bundle file and provide options to. You can provide a custom path to a redocly.yaml file, if not provided then it will try to load it from the root of your project if it exists.

Example: redocly.yaml Reference: https://redocly.com/docs/cli/configuration/. Only supports options marked as "Supported in Redoc CE".

info

When setting the redocly.yaml config, you website renders correctly only once it is built and run with the following commands:

npm run build
npm run serve

When running the website locally, with npm start, some error messages can be displayed.