Isolated Vue component development environment with a living style guide

Project was started when not finding a tool that generates documentation of components with hot reloading, read documentation and have a playground. Created from React Styleguidist, implement additional support to read and compile .vue files. Only supports vue 2.x.

Vue Styleguidist is a style guide generator for Vue components. It lists component and shows live, editable usage examples based on Markdown files. You can use it to generate a static HTML page to share and publish or as a workbench for developing new components using hot reloaded dev server.

Usage

• Getting Started: install and run Vue Styleguidist
• Documenting components: how to write documentation
• Locating components: point Vue Styleguidist to your Vue components
• Configuring webpack: tell Vue Styleguidist how to load your code
• Cookbook: how to solve common tasks with Vue Styleguidist

Advanced documentation

• Configuration
• CLI commands and options
• Node API

Examples

• Basic style guide, source
• Buefy style guide with sections, customized styles. source
• Style guide with vuetify and vue-i18n. source
• Style guide with customized styles, source
• Style guide with sections, source
• Style guide with navigation, source
• Style guide with Vuex, source
• Style guide with Nuxt.js, source

Showcases

Real projects using Vue Styleguidist:

• Croud Style Guide
• Vue Design System

Change log

The change log can be found on the Releases page.

Authors and license

We work on this project because we love the open source community and learn new things.

• Rafael: You can buy me a cup of coffee :)
• Bart: Send me money to make chameleon stickers. I promise I will send you one if you donate.