vue-docs

Generates Vue SFCs, integrates PropTable data, and updates MDX pages for @lumx/vue components.

26|9|Updated Jul 6, 2018
One-click install
npx skills add https://github.com/lumapps/design-system --skill vue-docs
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: vue-docs
Source: https://github.com/lumapps/design-system/tree/main/.claude/skills/vue-docs
Command: npx skills add https://github.com/lumapps/design-system --skill vue-docs

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill streamlines the process of adding comprehensive Vue documentation to components, ensuring consistency and discoverability across different frameworks.

Core Features & Use Cases

  • Vue Demo Creation: Generates Vue Single File Components (.vue SFCs) that mirror existing React demos.
  • Prop Table Integration: Automatically extracts and integrates component props, events, and slots for Vue.
  • MDX Page Updates: Modifies Markdown (MDX) files to include Vue framework support and demo references.
  • Use Case: When a component has React documentation but lacks Vue demos and prop tables, this Skill can be used to generate them, making the component's documentation complete for both React and Vue users.

Quick Start

Use the vue-docs skill to add Vue documentation for the button component.

Frequently Asked Questions about vue-docs

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

FAQPage Schema
How do I add Vue documentation to an existing React component?

Adding Vue documentation involves generating Vue Single File Components that mirror existing React demos, extracting Vue props and events for PropTable integration, and updating MDX pages with Vue framework references.

What is the best way to generate Vue demos from existing React demos?

The best way to generate Vue demos is by creating Vue Single File Components that mirror existing React implementations, ensuring documentation consistency and discoverability across both frameworks without manual duplication.

Does adding Vue docs require an existing MDX page and React demos?

Yes, adding Vue docs requires an existing MDX page and existing React demos. The component must also already exist in @lumx/vue to successfully generate Vue demos and prop table documentation.

Can I automatically extract Vue props, events, and slots for documentation?

Yes, you can automatically extract Vue props, events, and slots for documentation through PropTable integration, which modifies MDX files to include Vue framework support and component references.

Why are my Vue component docs missing the PropTable integration?

Vue component docs lack PropTable integration if the component does not exist in @lumx/vue or lacks existing React demos, since both are required prerequisites to generate Vue prop tables.