Star

MIT License
Copyright © 2020
CONNECT-platform

linkMarkdown Config

The markdown config determines which components are to be used for which markdown elements. For example, you can provide your own custom heading component:

.codedoc/components/heading.tsx
1import { RendererLike } from '@connectv/html';

2import { HeadingOptions } from '@codedoc/core/components';

3

4

5export function Heading(options: HeadingOptions, renderer: RendererLike<any, any>, content: any) {

6 return <h1 id={options.slug}># {content}</h1> // --> all headings are H1s, and they start with a #

7}

.codedoc/config.ts
1import { configuration } from '@codedoc/core';

2

3import { Heading } from './components/heading';

4

5//...

6

7export const config = /*#__PURE__*/configuration({

8 //...

9 markdown: {

10 Heading, // --> use your custom heading instead of the default heading component

11 }

12 //...

13});

CODEDOC uses @connectv/marked for transforming markdowns to HTML, which is how you can use TSX-based components in place of standard markdown structures like headings.

Learn More

linkCustom Components

@connectv/marked also supports custom components, i.e. TSX-components for user-defined non-standard markdown structures. This is how CODEDOC's enhanced features like buttons and tabs work. You can also provide your own custom components and use them in your markdown files.

Learn More

linkToC Markdown

CODEDOC uses a separate configuration for parsing the ToC markdown file, designated via the tocMarkdown config. This allows for having ToC specific components and structures. If you need to override the standard markdown elements of your ToC or need to add custom components just for use in the ToC, simply add them to tocMarkdown property instead of markdown property.

Markdown ConfigCustom ComponentsToC Markdown

Home Overview CLI Theme

Markdownchevron_right
Code Featureschevron_right

Images & Assets

Configurationchevron_right
Customizationchevron_right