在故事书中为普通 JS 类编写文档

【问题标题】：Writing documentation for plain JS class in storybook在故事书中为普通 JS 类编写文档
【发布时间】：2021-02-18 04:23:15
【问题描述】：

我刚刚开始将 Storybook 用于我正在开发的 UI 组件库。我想将为 JS 类方法和属性编写的 JSDoc 提取到 Storybook 中并创建一个 Doc。 Storybook 确实支持通过阅读其 propTypes 来为 React 组件创建文档。是否有插件或以某种方式为 JS 类做同样的事情。

我正在使用最新的故事书 6。

提前致谢

【问题讨论】：

标签： javascript documentation jsdoc storybook

【解决方案1】：

您可以像普通组件一样进行操作：

form-validators.stories.ts

import { FormValidators } from './path';

export default {
  title: 'Components/Form Validators',
  component: FormValidators,
  parameters: {
    previewTabs: { canvas: { hidden: true } },
    docsOnly: true,
  },
} as Meta;

export const Default: Story = () => ({
  template: '<div>Test</div>',
});

或者我更喜欢 MDX 文件。

form-validators.stories.mdx

import { ArgsTable } from '@storybook/addon-docs/blocks';
import { Meta } from '@storybook/addon-docs/blocks';
import { FormValidators } from './path';

<Meta
  title="Components/Form Validators"
  parameters={{ previewTabs: { canvas: { hidden: true } } }}
/>

<ArgsTable of={FormValidators} />

【讨论】：