Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/kamiazya/typedoc-plugin-mermaid

A plugin for TypeDoc that generates graphs for mermaid.js diagrams by @mermaid annotation.
https://github.com/kamiazya/typedoc-plugin-mermaid

diagram graph mermaid typedoc typedocplugin

Last synced: 3 months ago
JSON representation

A plugin for TypeDoc that generates graphs for mermaid.js diagrams by @mermaid annotation.

Host: GitHub
URL: https://github.com/kamiazya/typedoc-plugin-mermaid
Owner: kamiazya
License: mit
Created: 2019-03-07T10:48:19.000Z (almost 6 years ago)
Default Branch: main
Last Pushed: 2024-08-26T03:18:48.000Z (4 months ago)
Last Synced: 2024-08-29T16:11:18.104Z (4 months ago)
Topics: diagram, graph, mermaid, typedoc, typedocplugin
Language: TypeScript
Homepage: https://www.npmjs.com/package/typedoc-plugin-mermaid
Size: 1.34 MB
Stars: 27
Watchers: 3
Forks: 9
Open Issues: 11
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
- Security: SECURITY.md

Awesome Lists containing this project

README

        [![GitHub Action](https://github.com/kamiazya/typedoc-plugin-mermaid/workflows/Node%20CI/badge.svg)](https://github.com/kamiazya/typedoc-plugin-mermaid/actions?workflow=Node+CI)

[![CodeFactor](https://www.codefactor.io/repository/github/kamiazya/typedoc-plugin-mermaid/badge)](https://www.codefactor.io/repository/github/kamiazya/typedoc-plugin-mermaid)

[![npm version](https://badge.fury.io/js/typedoc-plugin-mermaid.svg)](https://badge.fury.io/js/typedoc-plugin-mermaid)

![node version](https://img.shields.io/node/v/typedoc-plugin-mermaid)

![npm](https://img.shields.io/npm/dm/typedoc-plugin-mermaid)

[![FOSSA Status](https://app.fossa.io/api/projects/git%2Bgithub.com%2Fkamiazya%2Ftypedoc-plugin-mermaid.svg?type=shield)](https://app.fossa.io/projects/git%2Bgithub.com%2Fkamiazya%2Ftypedoc-plugin-mermaid?ref=badge_shield)

[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)

[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg)](http://makeapullrequest.com)

[![All Contributors](https://img.shields.io/github/all-contributors/kamiazya/typedoc-plugin-mermaid?color=ee8449)](#contributors)

[![format: Biome](https://img.shields.io/badge/format%20with-Biome-F7B911?logo=biome&style=flat)](https://biomejs.dev/)

[![test: Vitest](https://img.shields.io/badge/tested%20with-Vitest-6E9F18?logo=vitest&style=flat)](https://vitest.dev/)

[![build: Vite](https://img.shields.io/badge/build%20with-Vite-646CFF?logo=vite&style=flat)](https://rollupjs.org/)

# typedoc-plugin-mermaid

A plugin for TypeDoc that generates graphs for mermaid.js diagrams by @mermaid annotation.

## Installation

The plugin can then be installed using [npm](https://www.npmjs.com/):

[![NPM](https://nodei.co/npm/typedoc-plugin-mermaid.png)](https://nodei.co/npm/typedoc-plugin-mermaid/)

```sh

# npm

npm install --save-dev typedoc-plugin-mermaid

# or yarn

yarn add -D typedoc-plugin-mermaid

```

Add this plugin in your `typedoc.json`:

```json

{

  "plugin": ["typedoc-plugin-mermaid"]

}

```

If you use the `@mermaid` tag in your tsdoc comments,

add `typedoc-plugin-mermaid/tsdoc.json` to the extends of tsdoc.json:

```json

{

  "$schema": "https://developer.microsoft.com/json-schemas/tsdoc/v0/tsdoc.schema.json",

  "extends": [

    "typedoc-plugin-mermaid/tsdoc.json"

  ]

}

```

## Usage

Write tsdoc with `@mermaid` annotations:

```typescript

/**

 * Hoge is sample class for example of `typedoc-plugin-mermaid`.

 *

 * @mermaid Make TypeDoc easy to use with mermaid.js

 * graph TB

 *   mermaid.js --> TypeDoc;

 */

export class Hoge { }

```

Or use fenced code blocks:

```typescript

/**

 * Mermaid code blocks are automatically detect and converted.

 *

 * ```mermaid

 * graph TB

 *   mermaid.js --> TypeDoc;

 * ```

 */

export class Mermaid { }

```

[↓↓ DEMO ↓↓](https://kamiazya.github.io/typedoc-plugin-samples/classes/hoge.html)

[![Example](https://github.com/kamiazya/typedoc-plugin-mermaid/raw/main/media/example.png)](https://kamiazya.github.io/typedoc-plugin-samples/classes/hoge.html)

### Arguments

The following arguments can be used in addition to the default TypeDoc arguments.

```bash

$ typedoc --help

...

Options:

 --mermaidVersion            [Mermaid Plugin] The version of mermaid.js to use.

...

```

- `--mermaidVersion`

    Specify mermaid.js version to use.

    Default: `latest`, Example: `8.14.0`

## Contributors

Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):

  

    

      
_{Yuki Yamazaki}
🤔 💻 ⚠️ 📖

      
_{Bob Kerns}
🐛 💻

      
_{Emily Marigold Klassen}
💻 ⚠️

      
_{Mathieu Jalbert-Claveau}
🐛

      
_{Michael Schmidt}
💻 ⚠️ 📖

      
_{Carl Fürstenberg}
🐛 🚇

      
_{Will Henderson}
💻 🐛 💡

    

    

      
_guryanovev
🐛

      
_{Ricardo Ferreira}
🤔

      
_{Maneet Goyal}
🤔

      
_{Juergen Zimmermann}
🐛

      
_{Michal Kindl}
️️️️♿️

      
_{Ludovic Muller}
️️️️♿️

    

  

This project follows the [all-contributors](https://github.com/all-contributors/all-contributors)

specification. Contributions of any kind welcome!

## License

This software is released under the MIT License, see [LICENSE](./LICENSE).

[![FOSSA Status](https://app.fossa.io/api/projects/git%2Bgithub.com%2Fkamiazya%2Ftypedoc-plugin-mermaid.svg?type=large)](https://app.fossa.io/projects/git%2Bgithub.com%2Fkamiazya%2Ftypedoc-plugin-mermaid?ref=badge_large)