Storybook 工具列擴充套件

工具列擴充套件可從 Storybook 的工具列 UI 控制全域故事的渲染選項。它是一個通用的擴充套件，可用於

• 為您的元件設定主題
• 設定您的元件的國際化 (i18n) 地區設定
• 在 Storybook 中設定幾乎任何使用全域變數的內容

框架支援

安裝

工具列是 Essentials 的一部分，因此預設會安裝在所有新的 Storybook 中。如果您需要將其新增至您的 Storybook，您可以執行

npm i -D @storybook/addon-toolbars

然後，將以下內容新增至 .storybook/main.js

export default {
  addons: ['@storybook/addon-toolbars'],
};

用法

用法記錄在文件中。

常見問題

這與 addon-contexts 有何不同？

Addon-toolbars 是 addon-contexts 的後繼者，後者在 Storybook 的工具列中提供了方便的全域工具列。

這兩個套件之間的主要差異在於 addon-toolbars 使用了 Storybook 的新 Story Args 功能，該功能具有以下優勢

• 標準化。Args 已內建在 6.x 版的 Storybook 中。由於 addon-toolbars 基於 args，因此您無需學習任何擴充套件特定的 API 即可使用它。

• 人體工學。全域 args 很容易在故事、Storybook 文件中，甚至在其他擴充套件中使用。

• 框架相容性。Args 與框架完全獨立，因此 addon-toolbars 與 React、Vue 3、Angular 等即裝即用，且擴充套件中無需任何框架邏輯。