@funda/storybook v1.0.3

Funda storybook

Here lives components and their stories used for visualization used at funda

How to use

After cloning the project:

$ npm install

You can either develop new components or just consume existing ones on your project.

For developing or edit existing components

$ npm run dev

This will start storybook and open it on a new browser tab.

For consuming existing components

$ npm install funda-storybook

Install it on your project. And import it as a normal component.

import Button from 'funda-storybook/src/components/Button/Button.vue';

Since Ain't Nobody Got Time for Typing That! ™ the module gives you an alias for webpack.

So you can use available components with:

import Button from '@components/Button/Button.vue';

Installing webpack alias

On your webpack config:

const fundaComponents = require('funda-storybook');

resolve: { alias: { ...fundaComponents } }

Quick reminder on npm link

You don't necessary need to use npm modules from npm. You can symlink local files to behave like they have been installed via npm. In this case is most interesting because you can be developing your components with storybook and want to preview them on your project.

For this module you would do:

$ npm link

Then you would go to the project you are trying to use it and:

$ npm link funda-storybook

This would like this local module as if it was installed.

TODO:

• Automatic publishing on npm with commit
• Automatic publishing storybook on commit
• How to consume CSS
• Where should static assets live?