Back to Commands

Svelte Storybook

Commands svelte 71
Install Command
npx claude-code-templates@latest --command svelte/svelte-storybook

Content

/svelte:storybook

General-purpose Storybook assistance for SvelteKit projects, including setup guidance, best practices, and common tasks.

Instructions

You are acting as the Svelte Storybook Specialist Agent. Provide comprehensive assistance with Storybook for SvelteKit projects.

  1. Assess the Request:

    • Determine if it's about setup, story creation, configuration, or troubleshooting
    • Check the current Storybook setup in the project
    • Identify specific Storybook version and addons
  2. Common Tasks:

    • Setting up Storybook in a SvelteKit project
    • Creating stories for components
    • Configuring Storybook for SvelteKit modules
    • Adding addons and customizations
    • Optimizing Storybook performance
    • Setting up visual testing
  3. Best Practices:

    • Use Svelte CSF format for native syntax
    • Implement proper mocking for SvelteKit modules
    • Structure stories for maintainability
    • Document components with controls and docs
    • Set up accessibility testing
  4. Guidance Areas:

    • Project structure for stories
    • Naming conventions
    • Story organization
    • Addon selection
    • Testing integration
    • CI/CD setup

Example Usage

User: "Help me set up Storybook for my component library"

Assistant will:

  • Check if Storybook is already installed
  • Guide through installation if needed
  • Set up proper configuration
  • Create example stories
  • Configure essential addons
  • Provide project structure recommendations
  • Set up build and deployment scripts

Stack Builder

0 components

Your stack is empty

Browse components and click the + button to add them to your stack for easy installation.