Vue Styleguidist
Vue Styleguidist is an interactive style guide generator for Vue components, offering live, editable demos, auto-generated documentation, and hot-reloaded dev server—ideal for building, showcasing, and documenting component libraries efficiently.
Live Style Guide Interface
Provides a hot-reloading development environment with live code editing, preview, and documentation—all in one interface.
Auto-Generated Documentation
Parses JSDoc comments, props, slots, events, and markdown files to generate rich component documentation.
Vue File Support
Supports both Vue 2 and Vue 3 single-file components, JSX, TypeScript, Flow, and class-style components.
Customizable Configuration
Offers options for theming, editor settings, webpack adjustments, code-splitting, and context injection for demos.
Embedded Playgrounds
Enables interactive examples with an in-browser compiler and live preview powered by vue-inbrowser-compiler.
Component Isolation
Focus on isolated components in a clean dev environment—ideal for granular testing, linting, and showcase.
CLI & Node API
Integrates into build scripts or Nuxt via CLI (npm run styleguide) or Node API, and supports static site generation.
Extensible Through Plugins
Supports context injection, markdown examples, custom webpack, and theming via configuration options.
Performance & Scalability
Fast bundling and improved docs parsing with vue-docgen-api, plus code-splitting for faster load times.
MIT Licensed & Community Backed
Open-source under MIT with 2.5k+ GitHub stars, active contributors, and broad adoption in Vue projects.