Storybook：全局样式应用于整个iframe

在 Storybook 中使用全局样式的最佳做法是使用 addParameters 方法中的 docs 配置项。

以下是一个示例，演示了如何在 storybook 中设置全局样式：

// .storybook/preview.js

import { addParameters } from '@storybook/react';

addParameters({ docs: { inlineStories: true, prepareForInline: storyFn => <div style={{ margin: '3em' }}>{storyFn()}</div>, styles: { // '.css' 文件路径可以更改为您的全局 css 样式表，或包含您的全局 css 的其他样式表路径。 infoBody: { backgroundColor: '#FFF', fontFamily: 'mono', color: 'black', }, source: { h1: { fontFamily: 'mono', }, }, }, }, });

使用上面的代码，可以将样式和组件文件分离，避免在不同的文件间切换。