https://github.com/chakas3/nuxt-storybook

Storybook Module for Nuxt
https://github.com/chakas3/nuxt-storybook

nuxt-module nuxt3 nuxtjs storybook storybook-addon storybookjs vue

Last synced: about 1 month ago
JSON representation

Storybook Module for Nuxt

• Host: GitHub
• URL: https://github.com/chakas3/nuxt-storybook
• Owner: chakAs3
• Created: 2023-08-27T20:23:39.000Z (over 1 year ago)
• Default Branch: master
• Last Pushed: 2023-09-19T15:29:55.000Z (over 1 year ago)
• Last Synced: 2024-04-14T10:13:17.876Z (8 months ago)
• Topics: nuxt-module, nuxt3, nuxtjs, storybook, storybook-addon, storybookjs, vue
• Language: MDX
• Homepage:
• Size: 2.36 MB
• Stars: 2
• Watchers: 3
• Forks: 2
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
![Nuxt Storybook](https://github.com/nuxt-modules/storybook/assets/904724/0396b16c-be9b-4b0d-83b5-5e35dd8298df)

# Nuxt Storybook

Integrate [Storybook](http://storybook.js.org) into your [Nuxt](https://nuxt.com) application.

## Installing

```

pnpm add -D @storybook-vue/nuxt-storybook

```

Update your `nuxt.config`:

```ts

  modules: [

    '@storybook-vue/nuxt-storybook',

  ],

  storybook: {

    url: 'http://localhost:6006',

    storybookRoute: '/__storybook__',

    port: 6006,

  },

```

Then run `pnpm dev` to start you Nuxt server.

## Demo

https://github.com/chakAs3/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 both Nuxt 3 and Nuxt 2

## 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 is no issues (consider adding tests).

5. Submit a PR.

## License

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

## Contacts :

🔖 Mail: [email protected]

💬 Discord: ChakAs3

🐦‍⬛ Twitter: [@ChakirQatab](https://twitter.com/ChakirQatab)