Skip to main content
⭐️ If you love EventCatalog, give it a star on GitHub. Thanks!

eventcatalog.config.js

Overview

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

Required fields

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: '/',
};

The example below will output EventCatalog under http://{your-site}.com/my-company

eventcatalog.config.js
module.exports = {
// renders as https://website.com/my-company/{routes}
base: 'my-company',
};

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 = {
// Setting to true will add / onto all routes e.g http://website.com/visualiser/
port: 3000,
};

generators

  • Type: Generator[]
  • Default: []

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

Generators are still in beta

This API is still in beta, as generators at the moment require your code to be in CJS format. We are working on supporting typescript and import statements too.

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"
},
],
],
};

landingPage

  • Type: string
  • Default: '/docs'

Configure the landing page URL your EventCatalog loads. By default EventCatalog loads /docs. Clicking on the EventCatalog logo (or your custom logo), will also go to this URL.

Examples include /visualiser, discover/events or custom pages /docs/services/InventoryService/0.0.2

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

docs

  • Type: object

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

  • Type: object
eventcatalog.config.js
module.exports = {
docs: {
sidebar: {
// Should the sub heading be rendered in the docs sidebar?
showPageHeadings: true,
// optional block to show/hide services in the sidebar (default true)
services: {
visible: true
},
// optional block show/hide messages in the sidebar (default true)
messages: {
visible: true
},
// optional block show/hide domains in the sidebar (default true)
domains: {
visible: true
},
// optional block show/hide teams in the sidebar (default true)
teams: {
visible: true
},
// optional block show/hide users in the sidebar (default true)
users: {
visible: true
}
}
}
};

Configuration for the documentation sidebar.

docs.sidebar options

OptionDescriptionDefault
domains.visible (optional)Show or hide domains in the navigation bartrue
services.visible (optional)Show or hide services in the navigation bartrue
messages.visible (optional)Show or hide messages in the navigation bartrue
teams.visible (optional)Show or hide teams in the navigation bartrue
users.visible (optional)Show or hide users in the navigation bartrue

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',
};
  • 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

./logo.png

  • 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
};