https://github.com/kickstartds/storybook-addon-html

https://github.com/kickstartds/storybook-addon-html

Last synced: about 1 month ago
JSON representation

• Host: GitHub
• URL: https://github.com/kickstartds/storybook-addon-html
• Owner: kickstartDS
• Created: 2024-01-08T17:35:14.000Z (12 months ago)
• Default Branch: main
• Last Pushed: 2024-04-12T07:00:30.000Z (9 months ago)
• Last Synced: 2024-04-12T15:04:48.837Z (9 months ago)
• Language: TypeScript
• Size: 302 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md

Awesome Lists containing this project

README

        
# Storybook Addon HTML

This addon for Storybook adds a tab that displays the compiled HTML for each

story.

## Getting Started

With NPM:

```sh

npm i --save-dev @kickstartds/storybook-addon-html

```

With Yarn:

```sh

yarn add -D @kickstartds/storybook-addon-html

```

### Register addon

```js

// .storybook/main.js

module.exports = {

  // ...

  addons: [

    "@kickstartds/storybook-addon-html",

    // ...

  ],

};

```

## Usage

You can add

[decorators](https://storybook.js.org/docs/react/writing-stories/decorators) to

wrap the story. This is usefull if you only want a subset of your decorators being applied for the html output.

```js

export const parameters = {

  html: {

    decorators: [

      (storyFn, context) => (

        

          {storyFn(context)}

        

      )

    ],

  },

};

```

## Supported frameworks

- React