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 以生成存根 dist 目錄。
3. 進行您的更改。
4. 執行 pnpm lint 驗證是否存在問題（考慮新增測試）。
5. 提交 PR。

許可證

此儲存庫根據 MIT 許可證 授權。您可以根據需要自由使用和修改程式碼。

聯絡方式

🔖 郵箱: [email protected]

💬 Discord: ChakAs3

🐦‍⬛ Twitter: @ChakirQatab

贊助商

感謝 Chromatic 提供視覺測試平臺，幫助我們審查 UI 更改並捕獲視覺迴歸。