react-docgen-typescript-markdown-render

Markdown render for react-docgen-typescript

Getting Started

1yarn add react-docgen-typescript-markdown-render

1import { markdownRender } from 'react-docgen-typescript-markdown-render';
2import * as path from 'path';
3import { parse } from 'react-docgen-typescript';
4
5const componentDocs = parse('Column.tsx', {
6  savePropValueAsString: true,
7})
8console.log(markdownRender(componentDocs));

The Component Column.tsx

1import * as React from "react";
2import { Component } from "react";
3
4/**
5 * Column properties.
6 */
7export interface IColumnProps {
8  /** prop1 description */
9  prop1?: string;
10  /** prop2 description */
11  prop2: number;
12  /**
13   * prop3 description
14   */
15  prop3: () => void;
16  /** prop4 description */
17  prop4: "option1" | "option2" | "option3";
18}
19
20/**
21 * Form column.
22 */
23export class Column extends Component<IColumnProps> {
24  render() {
25    return <div>Test</div>;
26  }
27}

Into

1### Column
2
3Form column.
4
5#### Props
6
7| Name               | Type                                | Default value | Description              |
8| ------------------ | ----------------------------------- | ------------- | ------------------------ |
9| prop1              | string                              | "red"         | prop1 description        |
10| prop2 _(required)_ | number                              |               | prop2 description        |
11| prop3 _(required)_ | () => void                          |               | prop3 description a \| b |
12| prop4 _(required)_ | "option1" \| "option2" \| "option3" |               | prop4 description 中文   |

License

Licensed under the APLv2. See the LICENSE file for details.