Quick Start

---

Get API documentation generated from your TypeScript source in under 5 minutes. Every page stays in sync with your code automatically - when you change a type, add a parameter, or rename a method, the docs update on the next build.

---

1. Add the Plugin

In your docusaurus.config.ts, import the plugin and add it to the plugins array:

import plugin from "@docsgen/docusaurus";

const config = {
  // ...your existing config
  plugins: [
    // ...other plugins
    [
      "@docsgen/docusaurus",
      {
        id: "api",
        outDir: "docs/api",
        packages: [
          {
            title: "my-library",
            dir: "../packages/my-library",
            entryPath: "src/index.ts",
            tsconfigDir: "../packages/my-library",
          },
        ],
      },
    ],
  ],
};

---

2. Configure Sidebars

Use Docusaurus autogenerated sidebars for the API section. In your sidebars.ts:

const sidebars = {
  api: [
    {
      type: "autogenerated",
      dirName: "api",
    },
  ],
};

export default sidebars;

---

3. Build

Run the Docusaurus build. docsgen will run TypeDoc on your source, generate MDX pages, and place them in docs/api/:

npm run build

Or start the dev server to see results immediately:

npm run start

---

4. Result

After building, you will find generated MDX files in docs/api/ organized by category:

docs/api/
  options.json
  my-library/
    docs.json
    package-config.json
    index.mdx
    Classes/
      MyClass.mdx
    Functions/
      myFunction.mdx
    Types/
      MyType.mdx
    Enums/
      MyEnum.mdx

Each page contains the symbol's name, description, type definition, parameters, return types, and usage examples - all extracted from your TypeScript source and JSDoc comments. These pages regenerate on every build, so they are always accurate.

---

5. Add the Importer - Keep Hand-written Docs Always Up to Date

The real power of docsgen is not just generating API pages - it is embedding live API fragments inside your hand-written guides so they never go stale. Add the importer remark plugin:

import { importer } from "@docsgen/core";

const config = {
  presets: [
    [
      "classic",
      {
        docs: {
          remarkPlugins: [
            importer({
              packageRoute: "api",
              apiDir: "docs/api",
            }),
          ],
        },
      },
    ],
  ],
};

Then use @import directives in any MDX file to embed API fragments:

(@import my-library MyClass type=methods&display=table)

This renders a compact table of all methods with their signatures and descriptions. You can also embed parameters, properties, return types, definitions, and more:

(@import my-library createClient type=parameters&display=table)

(@import my-library MyClass type=properties&display=grid)

(@import my-library createClient type=returns)

(@import my-library MyClass type=import)

The display option supports table, grid, and block modes for different documentation contexts. See the Importer guide for the complete reference.

Summary

You now have a working docsgen setup. See Configuration for all available options, Importer for the @import directive reference, and Customization for controlling the generated output.