Skip to content

sawden/storybook

 
 

Repository files navigation

Nuxt Storybook

Nuxt Storybook

Integrate Storybook into your Nuxt application.

Installing

npx nuxi@latest module add storybook

Update your nuxt.config:

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

Then run pnpm dev to start your Nuxt server.

Demo

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

Features

πŸ‘Œ Zero configuration to start (see video)

πŸͺ„ Access Storybook Terminal

🎨 Devtools tab with Storybook app

βš™οΈ Reference your Storybook config in your app

πŸ“¦ Extendable by Nuxt modules

πŸš€ Supports Nuxt 3 / Storybook 8

Nuxt 2

Nuxt 2 is supported with Storybook v6, you can check legacy code on the v4 branch.

Contributing

  1. Install dependencies with pnpm.
  2. Run pnpm dev:prepare to generate stubbed dist directory.
  3. Make your changes.
  4. Run pnpm lint to verify that there are no issues (consider adding tests).
  5. Submit a PR.

License

This repository is licensed under the MIT License. Feel free to use the code and modify it according to your needs.

Contacts :

πŸ”– Mail: javachakir@gmail.com

πŸ’¬ Discord: ChakAs3

πŸ¦β€β¬› Twitter: @ChakirQatab

Sponsors

Chromatic

Thanks to Chromatic for providing the visual testing platform that helps us review UI changes and catch visual regressions.

About

Storybook integration with Nuxt.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • TypeScript 76.5%
  • MDX 12.1%
  • Vue 6.8%
  • CSS 3.2%
  • JavaScript 1.4%