storybook-addon-swc

Storybook 附加元件，透過使用 swc 建置來改善建置時間。

🗒 範例

• webpack4
• webpack5

🚀 安裝

$ 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，此附加元件將被停用。	布林值	true
enableSwcLoader	如果設定為 false，則停用 swc-loader 並使用 babel-loader。	布林值	true
enableSwcMinify	如果設定為 false，則停用使用 swc 壓縮，並使用傳統的 terser 進行壓縮。	布林值	true
swcLoaderOptions	swc loader 的選項。	物件	請參閱
swcMinifyOptions	swc 壓縮的選項。	物件	請參閱

SWC 外掛程式

SWC 外掛程式功能仍處於實驗階段，但可以透過變更設定來使用，如下所示。

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

🎓 替代方案

storybook-addon-turbo-build

此附加元件將 babel-loader 替換為 esbuild-loader。
它在開發 storybook-addon-swc 時被用作參考。

storybook-builder-vite

此建置器將 Storybook 的建置系統從 Webpack 變更為 Vite。
Vite 非常快，因為它在開發期間不會進行捆綁。

🤝 貢獻

歡迎提出貢獻、問題和功能請求。

如果您想貢獻，請隨時查看問題頁面。

📝 授權

Copyright © 2020 @Karibash。

此專案採用 MIT 授權。