storybook-description-loader

KO | EN

gitlite — search

#javascript #python #hacktoberfest #react #ai #typescript #llm #go #golang #android #machine-learning #rust #deep-learning #linux

storybook-description-loader

★ 25 Open GitHub ↗

Add JSDoc comments to your storybook examples that show up on your DocsPage.

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# DEPRECATED – use Storybook's official docgen instead

See https://github.com/storybookjs/storybook/pull/19684. Should be available for Storybook v7.0.0 or later

# Storybook Description Loader

Add JSDoc comments to your storybook examples that show up on your DocsPage.

See Github issue that inspired this package:
https://github.com/storybookjs/storybook/issues/8527#issuecomment-593801278

# Usage

**Code**
```jsx
// A `primary` button is used for emphasis.
export const Primary = () => <Button primary>Submit</Button>

/**
 * Use the `loading` prop to indicate progress. Typically use
 * this to provide feedback when triggering asynchronous actions.
 */
export const Loading = () => <Button loading>Loading</Button>
```

**Rendered docs**

![](https://cl.ly/ec53a39ae2c9/Image%2525202020-03-02%252520at%25252010.50.55%252520PM.png)

# Installation

**1. Installing package**

You'll need to have [Storybook](https://github.com/storybookjs/storybook) and the [Docs Addon](https://github.com/storybookjs/storybook/tree/master/addons/docs) installed. Then run:

`npm install --save-dev story-description-loader`

**2. Adding to Webpack**

*If using JSX*
```
module: {
  rules: [
    {
      test: /\.stories\.jsx/,
      use: [{ loader: "story-description-loader", options: { isJSX: true } }],
    }
  ]
}
```

*If using TSX*
```
module: {
  rules: [
    {
      test: /\.stories\.tsx/,
      use: [{ loader: "story-description-loader", options: { isTSX: true } }],
    }
  ]
}
```

*Or plain old JS*

```
module: {
  rules: [
    {
      test: /\.stories\.js/,
      use: [{ loader: "story-description-loader" }],
    }
  ]
}
```

storybook-description-loader

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

storybook-description-loader

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

Download README