storybook
@nuxtjs/storybook

轻松将 Storybook 集成到您的 Nuxt 应用中,以隔离方式设计、构建和测试您的 UI 组件。

Nuxt Storybook

Nuxt Storybook

Storybook 集成到您的 Nuxt 应用中。

安装

npx nuxi@latest module add storybook

更新您的 nuxt.config

  modules: [
    '@nuxtjs/storybook',
  ],
  storybook: {
    url: 'https://:6006',
    storybookRoute: '/__storybook__',
    port: 6006,
  },

然后运行 pnpm dev 来启动您的 Nuxt 服务器。

演示

https://github.com/storybook-vue/nuxt-storybook-module-demo

功能

👌 开箱即用,无需配置(查看视频)

🪄 访问 Storybook 终端

🎨 包含 Storybook 应用的 Devtools 标签页

⚙️ 在您的应用中引用 Storybook 配置

📦 可通过 Nuxt 模块扩展

🚀 支持 Nuxt 3 / Storybook 8

Nuxt 2

Nuxt 2 使用 Storybook v6 版本支持,您可以在 v4 分支查看旧版代码。

贡献

  1. 使用 pnpm 安装依赖。
  2. 运行 pnpm dev:prepare 以生成存根 dist 目录。
  3. 进行您的更改。
  4. 运行 pnpm lint 以确保没有问题(考虑添加测试)。
  5. 提交 PR。

许可证

本仓库采用 MIT 许可证。请随意使用并根据需要修改代码。

联系方式

🔖 邮箱: javachakir@gmail.com

💬 Discord: ChakAs3

🐦‍⬛ Twitter: @ChakirQatab

赞助商

Chromatic

感谢 Chromatic 提供视觉测试平台,帮助我们审查 UI 更改并捕获视觉回归。