Storybook-addon-swc NPM

storybook-addon-swc

Storybook addon that improves build time by building with swc.

🗒 Examples

🚀 Installation

$ npm install -D storybook-addon-swc @swc/core

👏 Getting Started

Edit the .storybook/main.js file and register the addon.

module.exports = {
  addons: [
    'storybook-addon-swc',
  ],
};

🔧 Configurations

Additional configuration options can be passed as needed.

module.exports = {
  addons: [
    {
      name: 'storybook-addon-swc',
      options: {
        enable: true,
        enableSwcLoader: true,
        enableSwcMinify: true,
        swcLoaderOptions: {},
        swcMinifyOptions: {},
      },
    },
  ],
};

Options

Name	Description	Type	Default Value
`enable`	If set to false, this add-on will be disabled.	boolean	`true`
`enableSwcLoader`	If set to false, swc-loader is disabled and babel-loader is used.	boolean	`true`
`enableSwcMinify`	If set to false, minify using swc is disabled and minify using conventional terser is used.	boolean	`true`
`swcLoaderOptions`	Options for swc loader.	object	see
`swcMinifyOptions`	Options for swc minify.	object	see

SWC Plugins

The SWC plugins feature is still experimental, but can be used by changing the settings as follows.

module.exports = {
  addons: [
    {
      name: 'storybook-addon-swc',
      options: {
        swcLoaderOptions: {
          jsc: {
            experimental: {
              plugins: [['plugin-name', {}]],
            },
          },
        },
      },
    },
  ],
};