mirror of
https://github.com/nuxt/nuxt.git
synced 2024-11-11 08:33:53 +00:00
updated readme on running storybook with nuxt
detailed description on running storybook with vue
This commit is contained in:
parent
3806160796
commit
bc4140a46e
@ -1,24 +1,41 @@
|
||||
## Storybook demo for Nuxt
|
||||
# Storybook demo for Nuxt
|
||||
|
||||
Deo showcasing [Storybook](https://storybook.js.org/) usage with Nuxt.js, [Vuetify](https://vuetifyjs.com) and [Vue-Charts](http://vue-chartjs.org/)
|
||||
Demo showcasing [Storybook](https://storybook.js.org/) usage with Nuxt.js, [Vuetify](https://vuetifyjs.com) and [Vue-Charts](http://vue-chartjs.org/)
|
||||
|
||||
### Features
|
||||
## Features
|
||||
|
||||
* supports '~' and '~~' Nuxt.js aliases
|
||||
* contains storybase.js with helper classes
|
||||
* integrates most of addons
|
||||
* real life examples with Vuetify and Vue-Charts
|
||||
|
||||
### Usage
|
||||
## Description
|
||||
|
||||
Start the example o [http://localhost:3000](http://localhost:3000):
|
||||
This demo aims to integrate all the above mentioned technologies with best practices in mind.
|
||||
|
||||
```bash
|
||||
npm run dev
|
||||
Points of interest
|
||||
* `.storybook` folder contains storybook configuration
|
||||
* `stories` folder has number of stories corresponding to `components`
|
||||
* Note, Storybook is configured to understand Nuxt aliases `~` and `~~`
|
||||
* number of helpers in storybase.js to simplify storybook usahe
|
||||
|
||||
## Usage
|
||||
|
||||
To run locally in dev mode
|
||||
```
|
||||
|
||||
Run Storybook:
|
||||
|
||||
```bash
|
||||
npm run storybook
|
||||
```
|
||||
and then access the storybook from [localhost:9001](http://localhost:9001)
|
||||
|
||||
To build static storybook to `.out` folder
|
||||
```
|
||||
npm run storybookoutput
|
||||
```
|
||||
|
||||
|
||||
## More reading
|
||||
|
||||
* [Using Storybook with Nuxt](https://davidwalsh.name/storybook-nuxt) by David Walsh
|
||||
* [StoryBook for Vue](https://github.com/storybooks/storybook/tree/master/app/vue)
|
||||
* [Vue Kitchen sink Storybook demo](https://github.com/storybooks/storybook/tree/master/examples/vue-kitchen-sink)
|
||||
* [Vuetify Storybook boilerplate](https://github.com/white-rabbit-japan/vuetify-storyboard-boilerplate)
|
||||
|
Loading…
Reference in New Issue
Block a user