Getting Started With Storybook for Vue

Share this video with your friends

Send Tweet

In this lesson we'll go through the process of setting up Storybook for Vue. We'll use Vue CLI to create a new Vue application and Storybook CLI to setup some initial stories and config. Storybook can help you develop UI components in an isolated area without running your full application.

Additional Resources https://medium.com/storybookjs/introducing-storybook-for-vue-940f222541c5 https://storybook.js.org/basics/guide-vue/

Samuel Sommer
~ 6 years ago

webpack.config.js is not working inside a frehs nuxt project:

ERR! TypeError: Cannot read property 'plugins' of undefined ERR! at module.exports (/Users/samuelsommer/dev/vue-mastery/first-nuxt/.storybook/webpack.config.js:3:17) ERR! at Object.webpack (/Users/samuelsommer/dev/vue-mastery/first-nuxt/node_modules/@storybook/core/dist/server/preview/custom-webpack-preset.js:47:12) ERR! at process._tickCallback (internal/process/next_tick.js:68:7) ERR! { TypeError: Cannot read property 'plugins' of undefined ERR! at module.exports (/Users/samuelsommer/dev/vue-mastery/first-nuxt/.storybook/webpack.config.js:3:17) ERR! at Object.webpack (/Users/samuelsommer/dev/vue-mastery/first-nuxt/node_modules/@storybook/core/dist/server/preview/custom-webpack-preset.js:47:12) ERR! at process._tickCallback (internal/process/next_tick.js:68:7) ERR! stack: ERR! 'TypeError: Cannot read property 'plugins' of undefined\n at module.exports (/Users/samuelsommer/dev/vue-mastery/first-nuxt/.storybook/webpack.config.js:3:17)\n at Object.webpack (/Users/samuelsommer/dev/vue-mastery/first-nuxt/node_modules/@storybook/core/dist/server/preview/custom-webpack-preset.js:47:12)\n at process._tickCallback (internal/process/next_tick.js:68:7)' }

Samuel Sommer
~ 6 years ago

What's about Single File Components? I dislike to rewrite my components...