@whitespace/storybook-addon-html
A Storybook addon that extracts and displays compiled syntax-highlighted HTML
Last updated 4 months ago by jeanfredrik .
MIT · Repository · Original npm · Tarball · package.json
$ cnpm install @whitespace/storybook-addon-html 
SYNC missed versions from official npm registry.

Storybook Addon HTML

This addon for Storybook adds a tab that displays the compiled HTML for each story. It uses highlight.js for syntax highlighting.

Getting Started

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

Register addon

Create a file called addons.js inside the .storybook directory and add the following content:

// .storybook/addons.js

import '@whitespace/storybook-addon-html/register';

Usage

Add withHTML as a global decorator inside .storybook/config.js:

// .storybook/config.js

import { addDecorator } from '@storybook/html';
import { withHTML } from '@whitespace/storybook-addon-html/react';

addDecorator(withHTML);

The HTML is formatted with Prettier. You can override the Prettier config (except parser and plugins) by providing an object following the Prettier API override format:

// .storybook/config.js

import { addDecorator } from '@storybook/html';
import { withHTML } from '@whitespace/storybook-addon-html/react';

addDecorator(
  withHTML({
    prettier: {
      tabWidth: 4,
      useTabs: false,
      htmlWhitespaceSensitivity: 'strict',
    },
  }),
);

Supported frameworks

When importing the decorator, use the correct path for your framework, e.g. @whitespace/storybook-addon-html/react for React or @whitespace/storybook-addon-html/html for HTML.

Right now, the addon can be used with these frameworks:

  • HTML
  • React

Current Tags

  • 1.2.1                                ...           latest (4 months ago)

5 Versions

  • 1.2.1                                ...           4 months ago
  • 1.2.0                                ...           5 months ago
  • 1.1.0                                ...           5 months ago
  • 1.0.1                                ...           5 months ago
  • 1.0.0                                ...           6 months ago
Downloads
Today 0
This Week 0
This Month 2
Last Day 0
Last Week 0
Last Month 0
Dependencies (9)
Dev Dependencies (10)
Dependents (2)

Copyright 2014 - 2017 © taobao.org |