Storybook 附加组件 NxPkg

直接从您的组件创建一个一键式拉取请求环境

安装

yarn

yarn add --dev @nx-pkg/storybook-addon-nxpkg

npm

npm install @nx-pkg/storybook-addon-nxpkg --save-dev

pnpm

pnpm add --save-dev @nx-pkg/storybook-addon-nxpkg

用法

将以下内容添加到您的.storybook/main.ts（或.storybook/main.js）导出

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

在.storybook/preview.ts（或.storybook/preview.js）中配置仓库 URL

export default {
  parameters: {
    repositoryUrl: 'https://github.com/[username]/[reponame]'
  },
};

在您的故事文件中，设置特定故事的文件路径，例如

export const Primary: Story = {
  args: {/* ... */},
  parameters: {
    filePath: 'src/stories/Button.tsx'
  }
};

如果您的组件位于多个仓库中，您也可以针对特定故事定义仓库 URL

export const Primary: Story = {
  args: {/* ... */},
  parameters: {
    filePath: 'src/stories/Button.tsx',
    repositoryUrl: 'https://github.com/[username]/[reponame]'
  }
};

开发脚本

• yarn start 以监视模式运行 babel 并启动 Storybook
• yarn build 构建和打包您的附加组件代码

附加组件图标

（适用于 Storybook 集成目录）