Typescript

Generate docs from Typescript definitions

Usage

npm install fumadocs-typescript

UI Integration

It comes with the AutoTypeTable component. Learn more about Auto Type Table.

Generate MDX Files

You may generate MDX files statically.

script.mjs
import { generateFiles } from 'fumadocs-typescript';
import * as path from 'node:path';

void generateFiles({
  input: ['./content/docs/**/*.model.mdx'],
  // Rename x.model.mdx to x.mdx
  output: (file) =>
    path.resolve(
      path.dirname(file),
      `${path.basename(file).split('.')[0]}.mdx`,
    ),
});

Create a model MDX file.

content/docs/file.model.mdx
---
title: Hello World
---

## All Exported Properties

---type-table---
./my/typescript/file.ts
---end---

## Specified Property

---type-table---
./my/typescript/file.ts#Property
---end---

Run this script with node ./script.mjs.

Generated MDX files assumes you are using the Tailwind CSS preset of Fumadocs UI. If you want to customise generated output, use the templates option.

Forced Type Name

You can specify the name of type with the @remarks tsdoc tag.

interface MyInterface {
  /**
   * @remarks `timestamp` Returned by API.
   */
  time: number;
}

Demo

Below is an example generated from Typescript definitions.

enabledboolean

No Description

componentReactNode

No Description

githubUrlstring

Github url displayed on the navbar

titleReactNode

No Description

urlstring

Redirect url of title

  • defaultValue: '/'
linksNavLinkProps[]

No Description

transparentMode"always" | "top" | "none"

When to use transparent navbar

  • defaultValue: none
childrenReactNode

No Description

Last updated on