SWC

Storybook 插件,用于启用 SWC 构建。

在 Github 上查看

storybook-addon-swc

npm version codecov license Github Twitter

Storybook 插件,通过使用 swc 构建来提高构建速度。

🗒 示例

🚀 安装

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

👏 入门

编辑 .storybook/main.js 文件并注册插件。

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

🔧 配置

可以根据需要传递额外的配置选项。

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

选项

名称 描述 类型 默认值
enable 如果设置为 false,则该插件将被禁用。 boolean true
enableSwcLoader 如果设置为 false,则 swc-loader 将被禁用,并使用 babel-loader。 boolean true
enableSwcMinify 如果设置为 false,则使用 swc 进行压缩将被禁用,并使用传统的 terser 进行压缩。 boolean true
swcLoaderOptions swc 加载器的选项。 object 查看
swcMinifyOptions swc 压缩的选项。 object 查看

SWC 插件

SWC 插件功能仍处于实验阶段,但可以通过更改以下设置来使用。

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

🎓 替代方案

storybook-addon-turbo-build

该插件用 esbuild-loader 替换 babel-loader。
它在 storybook-addon-swc 的开发中被用作参考。

storybook-builder-vite

该构建器将 Storybook 的构建系统从 Webpack 更改为 Vite。
Vite 非常快,因为它在开发过程中不会进行打包。

🤝 贡献

欢迎贡献、问题和功能请求。

如果您想贡献,请随时查看 问题页面

📝 许可证

版权所有 © 2020 @Karibash.

该项目采用 MIT 许可证。

由以下人员制作
  • radist2s
    radist2s
与以下内容配合使用
    React
标签