Remark Docs Generation

Useful remark plugins to generate docs automatically

Usage

npm install fumadocs-docgen

Add the remark plugin.

import { remarkDocGen } from 'fumadocs-docgen';
 
const config = {
  remarkPlugins: [[remarkDocGen, { generators: [] }]],
};

Use generators in a markdown/MDX file with:

```json doc-gen:<generator>
{
  // options
}
```

Generators

You can add a generator to the generators array.

import { remarkDocGen, fileGenerator } from 'fumadocs-docgen';
 
const config = {
  remarkPlugins: [[remarkDocGen, { generators: [fileGenerator()] }]],
};

The package is already bundled with several generators, you can import them from the package directly.

File Generator

It copies the content from a file to the document (mdast tree) and forms a paragraph.

```json doc-gen:file
{
  "file": "./my/file.txt"
}
```

As Code Block

Copy the content into a code block.

```json doc-gen:file
{
  "file": "./my/file.txt",
  "codeblock": true
}
```

Or to specify the programming language and meta string:

```json doc-gen:file
{
  "file": "./my/file.txt",
  "codeblock": {
    "lang": "ts",
    "meta": "title=\"Hello\""
  }
}
```

Typescript Generator

MDX Only.

Generate docs from real Typescript definitions. This generator is powered by the fumadocs-typescript package, which also offers a plenty of features.

It takes the current working directory as root directory, then look for your Typescript configuration file (tsconfig.json). You may configure it with generator options.

To use it, specify the Typescript file and exported type you want to generate from.

```json doc-gen:typescript
{
  "file": "./my-file.ts",
  "name": "MyInterface"
}
```

This will generate a type table:

<TypeTable
  type={{ name: { type: 'string', description: <>The name of player</> } }}
/>

You can import the component from fumadocs-ui, or make your own implementation. The type definition of props can be found at VirtualTypeTableProps.

Edit on GitHub

Last updated on

On this page