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 应用程序的开发者工具选项卡

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

📦 可由 Nuxt 模块扩展

🚀 支持 Nuxt 3 / Storybook 8

Nuxt 2

Nuxt 2 支持 Storybook v6，您可以在 v4 分支上查看旧代码。

贡献

1. 使用 pnpm 安装依赖项。
2. 运行 pnpm dev:prepare 生成 stubbed dist 目录。
3. 进行您的更改。
4. 运行 pnpm lint 验证是否存在问题（考虑添加测试）。
5. 提交 PR。

许可证

此存储库采用 MIT 许可证 授权。您可以根据需要自由使用和修改代码。

联系方式

🔖 邮箱: [email protected]

💬 Discord: ChakAs3

🐦‍⬛ Twitter: @ChakirQatab

赞助商

感谢 Chromatic 提供可视化测试平台，帮助我们审查 UI 更改并发现视觉回归。