eventcatalog.config.js

Overview

eventcatalog.config.js contains configurations for your site and is placed in the root directory of your site.

Required fields

`cId`

Type: string

An automated generated ID for your catalog. EventCatalog will generate this for you.

eventcatalog.config.js
module.exports = {
  cId: '107fdebb-7c68-42cc-975d-413b1d30d758',
};

`title`

Type: string

Title for your website.

eventcatalog.config.js
module.exports = {
  title: 'EventCatalog',
};

`organizationName`

Type: string

Your organization name.

eventcatalog.config.js
module.exports = {
  organizationName: 'Your Company',
};

Optional fields

`base`

Type: string
Default value: /

The base path to deploy to. EventCatalog will use this path as the root for your pages and assets both in development and in production build.

eventcatalog.config.js
module.exports = {
  base: '/',
};

`output`

Added in eventcatalog@2.35.4

Type: string
Default value: static

The output type for your EventCatalog, choose from static or server.

"What is the difference between static and server?"

static - The default output type for EventCatalog. This will output a static website that you can host anywhere.
server - This will output a Node.js server that you can host anywhere. This is required for certain features like the EventCatalog Chat (bring your own keys). The easiest way to host this is with our Docker image.

eventcatalog.config.js
module.exports = {
  output: 'static',
};

`outDir`

Added in eventcatalog@2.11.4

Type: string
Default value: dist

The output path of your EventCatalog. By default it will output to the dist folder.

eventcatalog.config.js
module.exports = {
  // Catalog would output to the /build folder
  outDir: 'build',
};

`trailingSlash`

Type: boolean
Default: false

Set the route matching behavior of the dev server. Choose from the following options:

'true' - Only match URLs that include a trailing slash (ex: “/foo/“) 'false' - Match URLs regardless of whether a trailing ”/” exists

Use this configuration option if your production host has strict handling of how trailing slashes work or do not work.

eventcatalog.config.js
module.exports = {
  // Setting to true will add / onto all routes e.g http://website.com/visualiser/
  trailingSlash: true,
};

`port`

Type: number
Default: 3000

Configure the port EventCatalog is running on.

eventcatalog.config.js
module.exports = {
  // Changes the port from default 3000 to 5000
  port: 5000,
};

`host`

Added in eventcatalog@2.42.9

Type: string | boolean
Default: false

Set which network IP addresses the dev server should listen on (i.e. non-localhost IPs).

false - do not expose on a network IP address
true - listen on all addresses, including LAN and public addresses
[custom-address] - expose on a network IP address at [custom-address]

eventcatalog.config.js
module.exports = {
  host: '0.0.0.0',
};

`server.allowedHosts`

Added in eventcatalog@2.64.0

Type: string[] | true
Default: []

A list of hostnames that Astro is allowed to respond to. When the value is set to true, any hostname is allowed.

You can read more on the Astro documentation here.

eventcatalog.config.js
module.exports = {
  server: {
    allowedHosts: ['example.com', 'subdomain.example.com'],
  },
};

`generators`

Type: Generator[]
Default: []

Generators are the foundation of plugins with EventCatalog. EventCatalog will call your generators on build.

eventcatalog.config.js
module.exports = {
  generators: [
    [
      // This will load plugin.js in the root of your catalog
      '<rootDir>/plugin.js',
      // configuration for your generator
      {
        customValue: true,
        test: "Add any configuration values you want"
      },
    ],
  ],
};

`environments`

Added in eventcatalog@2.48.2

Type: object
Default: {}

Optional configuration for EventCatalog environments.

When environments are set, a dropdown will be shown in the top right of the EventCatalog allowing your users to switch between environments.

eventcatalog.config.js
module.exports = {
  environments: [
    {
      // Name of the environment
      name: 'Development',
      // URL of the environment
      url: 'https://demo.eventcatalog.dev',
      // Description of the environment
      description: 'Local development environment',
      // Short name of the environment (optional, used in the dropdown)
      shortName: 'Dev'
    },
    {
      name: 'Test',
      url: 'https://demo.eventcatalog.dev',
      description: 'Test environment for QA',
      shortName: 'Test'
    },
    {
      name: 'Production',
      url: 'https://demo.eventcatalog.dev',
      description: 'Production environment',
      shortName: 'Prod'
    },
  ]
};

`landingPage`

Type: string
Default: '/docs'

Configure the landing page URL your EventCatalog loads. By default EventCatalog loads / (the default or custom landing page).

Clicking on the EventCatalog logo (or your custom logo), will also go to this URL.

If you set this value the Home icon in the vertical navigation will not be shown and your users will be redirected to this default URL.

You can set this to any EventCatalog page URL.

Examples:

/visualiser
/discover/events
/docs/services/InventoryService/0.0.2

eventcatalog.config.js
module.exports = {
  landingPage: '/visualiser',
};

`sidebar`

Added in eventcatalog@2.30.1

Type: Array[{ id: string, visible: boolean }]

Configure the application sidebar in EventCatalog.

Show/hide items in the sidebar, see list of options.

eventcatalog.config.js
module.exports = {
  sidebar: {
    // Will hide the AI chat feature in the sidebar
    id: '/chat',
    visible: false
  }
};

`visualiser`

Added in eventcatalog@2.42.0

Type: object

Configuration for the EventCatalog visualiser.

eventcatalog.config.js
module.exports = {
  visualiser: {
    // visualizer is enabled by default
    // you can turn it off by setting it to false
    enabled: true,

    channels: {
      // The render mode for channels in the visualiser
      // Flat or single
      renderMode: 'flat'
    }
  }
};

Configuration	Option	Default	Description
`visualiser.enabled`	`true` or `false`	`true`	Enabled or disables the visualiser. Setting this to false will not render any visualiser pages in your catalog and also remove references to the visualiser features in your catalog. (Added in 2.65.1)
`visualiser.channels.renderMode`	`flat` or `single`	`flat`	The render mode for the visualiser. `flat` means the channel node is duplicated for each message. `single` means the channel node is a single node for all messages. Depending on your use case/preferences you may want to use one or the other.

`docs`

Type: object

Configure the documentation sidebar in EventCatalog.

eventcatalog.config.js
module.exports = {
   docs: {
    sidebar: {
      type: 'LIST_VIEW'
    }
  }
};

Configuration for the documentation sidebar.

`docs.sidebar` options

You can choose between LIST_VIEW or TREE_VIEW to render your documentation.

LIST_VIEW will render your docs as you see in the demo
TREE_VIEW will render the DOCS as a tree view and map your file system folder structure.
- Can be useful for large catalogs and navigation

Added in eventcatalog@2.28.0

eventcatalog.config.js
docs: {
    sidebar: {
      type: 'LIST_VIEW'
    },
  },

Show/Hide Orphaned Messages

Added in eventcatalog@2.61.8

Any messages that do not belong to a service will be shown as orphaned messages in the sidebar (LIST_VIEW only).

If you wish to hide orphaned messages you can set the showOrphanedMessages to false.

eventcatalog.config.js
docs: {
    sidebar: {
      type: 'LIST_VIEW',
      // Default is true
      showOrphanedMessages: false,
    },
  },

`changelog`

Added in eventcatalog@2.42.6

Type: object

Configuration for EventCatalog Changelog.

You can turn off the changelog feature by setting enabled to false.

Reduce build size

If you don't want to use the changelog feature, you can turn it off to reduce the build size of your EventCatalog.

eventcatalog.config.js
module.exports = {
  changelog: {
    // Default is true
    enabled: true,
  },
};

`editUrl`

Type: string

URL used when people want to edit the documentation. For example your GitHub repo and branch.

eventcatalog.config.js
module.exports = {
  editUrl: 'https://github.com/boyney123/eventcatalog-demo/edit/master',
};

`repositoryUrl`

Added in eventcatalog@2.42.3

Type: string

tip

For Stater or Scale plans. This gives you the ability to show your own GitHub repository in EventCatalog (in the header bar).

URL to your repository for EventCatalog.

eventcatalog.config.js
module.exports = {
  repositoryUrl: 'https://github.com/boyney123/eventcatalog-demo',
};

`logo`

Type: object

Logo, alt and text for your company logo.

Public directory

Add your logo to your /public directory.

eventcatalog.config.js
module.exports = {
  logo: {
    // This logo is located at public/logo.svg
    src: '/logo.svg',
    alt: 'Company logo',
    text: 'Urban Slice | EventCatalog',
  },
};

Example output

`homepageLink`

Type: string

URL used when people want to link the logo & title in the top navigation to the homepage of a website.

eventcatalog.config.js
module.exports = {
  homepageLink: 'https://eventcatalog.dev',
};

`mdxOptimize`

Type: string

This is an optional configuration setting to optimize the MDX output for faster builds. This may be useful if you have many catalog files and notice slow builds. However, this option may generate some unescaped HTML, so make sure your catalog interactive parts still work correctly after enabling it.

This is disabled by default.

Read Astro documentation on optimize for MDX for more information.

eventcatalog.config.js
module.exports = {
  mdxOptimize: true
};

`compress`

Added in eventcatalog@2.48.5

Type: boolean

Setting this to true will automatically compress all your CSS, HTML, SVG, JavaScript, JSON and image files in the Astro outDir folder.

This is disabled by default from EventCatalog v2.61.9.

This only works for static builds.

eventcatalog.config.js
module.exports = {
  compress: true
};

`asyncAPI.renderParsedSchemas`

Added in eventcatalog@2.12.1

Type: boolean

EventCatalog will render your AsyncAPI files into their own pages. By default EventCatalog will read your AsyncAPI files and parse your schemas to render them on the screen. Part of this process is validating your schemas and also adding metadata onto them (default).

If you want to keep your schemas as they are then you can set the asyncAPI.renderParsedSchemas to false.

Having issues rendering AsyncAPI files?

If you are having issues seeing or rendering your AsyncAPI file try setting the renderParsedSchemas to false

eventcatalog.config.js
module.exports = {
  asyncAPI: {
    renderParsedSchemas: false // default is true
  }
};

`mermaid`

Added in eventcatalog@2.18.1

Type: object

EventCatalog uses mermaid to render diagrams.

Using mermaid you can render icons in your diagrams (e.g AWS architecture icons).

eventcatalog.config.js
module.exports = {
  mermaid: {
    iconPacks: ['logos'] // will load https://icones.js.org/collection/logos into eventcatalog
  }
};

You can choose from over 200,000 icons from icones.js.org.

`rss`

Added in eventcatalog@2.21.1

Enable RSS feeds for messages, services, domains and flows.

RSS feeds are disabled by default.

eventcatalog.config.js
{
  rss: {
    // Turn rss on or off 
    enabled: true,
    // The number of items to include in the RSS feed
    limit: 20
  }
}

See the RSS documentation for more information and examples.

`llms.txt`

Added in eventcatalog@2.20.0

Enable tools like Claude, ChatGPT, GitHub Copilot, and Cursor to quickly understand your EventCatalog.

eventcatalog.config.js
{
  llmsTxt: {
    enabled: true,
  }
}

See the LLMs documentation for more information, how you can use it and examples.

`fullCatalogAPIEnabled`

Type: boolean

Enables the ability to get the full catalog dump in the /api/catalog endpoint.

This is enabled by default.

eventcatalog.config.js
module.exports = {
  fullCatalogAPIEnabled: true,
};