storybook-addon-swc
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
许可证。