Storybook/插件:带有主题的 styled-components
用于 styled components 并带有主题提供程序的 Storybook 插件
入门指南
安装
yarn add storybook-addon-styled-components-themes --D
配置
在 .storybook/main.js 中注册插件
module.exports = {
stories: ['../src/**/*.stories.(tsx|mdx)'],
addons: ['storybook-addon-styled-components-themes/register']
};
在 .storybook/preview.js 中为故事添加参数
addParameters({
styledComponentsThemes: {
/**
* Themes
*/
themes: [ThemeA, ThemeB],
/**
* Theme to start on - index - optional
*/
initialTheme: 1, // optional
/**
* Key for show name of theme - optional
*/
label: 'name', // optional
},
});
在 .storybook/preview.js 中为故事添加装饰器
addDecorator(story => (
<WithThemeProvider>
{story()}
</WithThemeProvider>
));
许可
本项目根据 MIT 许可证获得许可 - 有关详细信息,请参阅 LICENSE.md 文件