Storybook 外掛程式主題切換器

一個用於切換不同主題(例如:daisyUI 等)的 Storybook 外掛程式。

在 Github 上檢視

Animation

此外掛程式僅控制主題(例如:lightdark),僅將 data-theme 屬性新增至 html 標籤。

它可以與 daisyUI 等 UI 函式庫完美搭配使用。

支援 Storybook 8

開始使用

將此外掛程式新增至 .storybook/main.js (main.ts) 檔案中。

module.exports = {
  ...
 addons: [
     // your addons here
     "storybook-addon-theme-changer"
  ],
};

將您的主題新增至 .storybook/preview.js (preview.ts) 檔案中

...
export const globalTypes = {
 themes: {
   defaultValue: [
     "light",
     "dark",
     ...
   ],
 },

...
export const globals = {
    themes: [
     "light",
     "dark",
     ...
    ],
},