@nuxtjs/storybook

Storybook integration with NuxtJS

• ✨  Release Notes
• 📖  Documentation

Nuxt 3

For Nuxt 3 support, checkout https://github.com/hirotaka/storybook-addon-nuxt

Features

• Zero configuration
• Nuxt webpack configuration
• Nuxt plugins support
• Story discovery from nuxt modules
• Nuxt components support
• Storybook Generate
• Hot reload support
• Nuxt server middlewares

📖  Read more

Quick Setup

1. Add @nuxtjs/storybook dependency to your project:

#using yarn
yarn add --dev @nuxtjs/storybook postcss@8 css-loader@5.2.0
# using npm
npm install --save-dev @nuxtjs/storybook postcss@8 css-loader@5.2.0

If you are using Nuxt < 2.14.0, you need to use core-js@3

2. Add .nuxt-storybook and storybook-static to your .gitignore:

.nuxt-storybook
storybook-static

3. Start adding stories

Configure

Then, add storybook section in nuxt.config.js:

export default {
  storybook: {
    // Options
  }
}

See module options.

Run

Now you can use nuxt storybook to start:

# Using yarn
yarn nuxt storybook

# Using npm
npx nuxt storybook

Development

1. Clone this repository
2. Install dependencies using yarn install
3. Start storybook server using yarn dev

Gitpod

License

MIT License

Copyright ©