Nuxt Storybook

將 Storybook 整合到您的 Nuxt 應用程式中。

安裝

npx nuxi@latest module add storybook

更新您的 nuxt.config

  modules: [
    '@nuxtjs/storybook',
  ],
  storybook: {
    url: 'https://127.0.0.1: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 許可證授權。您可以自由使用程式碼並根據您的需求修改。

聯絡方式

🔖 電子郵件：javachakir@gmail.com

💬 Discord：ChakAs3

🐦‍⬛ Twitter：@ChakirQatab

贊助商

感謝 Chromatic 提供視覺化測試平台，協助我們審查 UI 變更並捕捉視覺迴歸。