skills.rest
exceptionless
exceptionlessOFFICIAL
Explore all skills by this author →
Website𝕏@ExceptionlessGitHub

storybook

Create and update Storybook stories for Svelte components with CSF and autodocs.

2.5k|507|Updated Feb 7, 2014
Search Tags:#frontend#svelte#storybook#ui development#component documentation#autodocs
One-click install
npx skills add https://github.com/exceptionless/Exceptionless --skill storybook-exceptionless
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: storybook
Source: https://github.com/exceptionless/Exceptionless/tree/main/.agents/skills/storybook
Command: npx skills add https://github.com/exceptionless/Exceptionless --skill storybook-exceptionless

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill streamlines the process of creating and maintaining visual documentation for Svelte components using Storybook, ensuring components are well-documented and easily testable in isolation.

Core Features & Use Cases

  • Svelte CSF Story Format: Write stories in a format optimized for Svelte components.
  • Component Documentation: Define metadata, control arguments (argTypes), and enable autodocs for components.
  • Use Case: When developing a new Svelte UI library, use this Skill to set up Storybook, write stories for each component, and configure autodocs to generate a browsable documentation website.

Quick Start

Use the storybook skill to create a new story file for the Svelte component located at src/lib/components/Button.svelte.

Frequently Asked Questions about storybook

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I document Svelte components with Storybook?▼

Document Svelte components with Storybook by writing stories using Svelte CSF format, defining metadata and argTypes to enable autodocs generation for a browsable component library website.

What is Svelte CSF format for Storybook stories?▼

Svelte CSF is an optimized story format for Svelte components that allows you to define stories using defineMeta, configure argTypes, and apply snippet-based customization for visual documentation.

How do I set up autodocs for a Svelte UI library?▼

Set up autodocs for a Svelte UI library by creating story files with defineMeta and configuring argTypes, which automatically generates browsable documentation for your isolated components.

Can I use snippet-based customization in Svelte Storybook stories?▼

Yes, snippet-based customization is supported when creating or updating Storybook stories for Svelte components, allowing you to tailor component rendering and visual documentation behavior.

What is the best way to add visual documentation to Svelte components?▼

The best way to add visual documentation to Svelte components is using Storybook with Svelte CSF to write stories, define metadata, and run autodocs generation for isolated testability.

Related Skills

Explore More Software Engineering Skills→
vecearvecear

storybook-setup

Automate Storybook setup, configuration, and CSF3 story authoring for frontend projects.

Community
Intermediate
iButtersiButters
3

storybook

Create CSF 3.0 Storybook stories for React components with MDX documentation.

Community
Advanced
dkyazzentwatwadkyazzentwatwa
32

visual-regression

Automate visual regression testing setup for React, Vue, and Svelte projects.

Community
Advanced
mgd34msumgd34msu
4

storybook

Develop, document, and test UI components in isolation with Storybook.

Community
Intermediate