参加直播:周四,美国东部时间上午 11 点,Storybook 9 发布与 AMA

最新动态

旨在让用户查看您的仓库最新动态的 Storybook 插件

在 Github 上查看

storybook-addon-whats-new

这是什么?

这是一个 Storybook 插件,旨在让用户查看您的仓库有什么新内容。建议链接到您的 CHANGELOG.md 文件以获取自动更新,或者您可以自定义管理一个 Markdown 文件以提供更详细的更新信息。

安全策略

设置安全策略

如何安装?

安装依赖

yarn add -D storybook-addon-whats-new

Storybook 5.3 及更高版本

然后将其添加到您的 .storybook/main.js 文件中

module.exports = {
  // other configs here
  addons: ['storybook-addon-whats-new']
}

Storybook <=5.2 版本

在 Storybook 配置文件目录(默认为 .storybook)中编辑或创建一个名为 addons.js 的文件。将以下内容添加到其中

import 'storybook-addon-whats-new';

入门

本地配置

要配置此插件,您必须提供一个 whatsNewSource 参数,指定要显示的 Markdown 文件的位置

import React from "react";
import { Button } from "./Button";
import WhatsNew from './WHATS_NEW.md';

export default {
  title: "Example/Button",
  component: Button,
  parameters: {
    whatsNewSource: WhatsNew,
  },
};

全局配置

如果您想在每个 story 中都显示最新动态面板,可以在 .storybook/preview.js(Storybook <= 5.2 版本为 .storybook/config.js)中进行全局配置。要配置此插件,您必须提供一个 whatsNewSource 参数,指定要显示的 Markdown 文件的位置

import { addParameters } from '@storybook/react'; // <- or your storybook framework
import WhatsNew from './WHATS_NEW.md';

addParameters({
  whatsNewSource: WhatsNew,
});