Storybook 视口插件

Storybook 视口插件允许您的故事在 Storybook 中以不同的尺寸和布局显示。这有助于在 Storybook 内部构建响应式组件。

框架支持

安装

视口是 基本功能 的一部分，因此默认情况下会在所有新的 Storybook 中安装。如果您需要将其添加到您的 Storybook 中，您可以运行

npm i -D @storybook/addon-viewport

然后，将以下内容添加到 .storybook/main.js

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

您现在应该能够在屏幕顶部的工具栏中看到视口插件图标。

使用

使用方法在 文档 中有说明。