加入直播会话:周四,美国东部时间上午 11 点,Storybook 9 发布 & AMA

设计

用于在插件面板中嵌入设计预览的 Storybook 插件

在 Github 上查看

npm version Monthly download GitHub license code style: prettier

@storybook/addon-designs

一个 Storybook 插件,用于在插件面板中嵌入 Figma 或网站,以改善设计-开发工作流程。

要求

  • Storybook@>=9.0.0 (此插件的第 7 版支持 Storybook 7,第 8 版支持 Storybook 8)

此插件应适用于任何框架。如果您发现插件无法工作,请提交一个问题。

入门

1. 安装

npm install -D @storybook/addon-designs

yarn add -D @storybook/addon-designs

pnpm add -D @storybook/addon-designs

2. 在 main.js 中注册插件

export default {
  addons: ["@storybook/addon-designs"],
};

3. 将其添加到 story!

export default {
  title: "My stories",
  component: Button,
};

export const myStory = {
  parameters: {
    design: {
      type: "figma",
      url: "https://www.figma.com/file/LKQ4FJ4bTnCSjedbRpk931/Sample-File",
    },
  },
};

类似项目

贡献者
  • ndelangen
    ndelangen
  • shilman
    shilman
  • tmeasday
    tmeasday
  • ghengeveld
    ghengeveld
  • winkervsbecks
    winkervsbecks
  • yannbf
    yannbf
标签