Config Hook

As of Version 3 @nuxtjs/storybook will provide API for modules to modify Storybook config and add their own stories. Modules can use storybook:config hook to access Storybook config and add their own stories.

It is highly recommended to create your stories under Modules. This is best way to keep storybook clean. Take a look at below example. Read more about naming

Here is a sample example:

my-module/index.js
export default function() {
  const { nuxt } = this

  nuxt.hook('storybook:config', ({ stories }) => {
    stories.push("my-module/stories/*.stories.js")
  })
}
my-module/awesome.stories.js
export default {
  title: "Moduels/Awesome Module"
}

export const awesomeStory = () => "<div>AWESOME</div>"

Just like that, now everyone that uses my-module will see your story inside Storybook.

Edit this page on GitHub Updated at Mon, Sep 11, 2023