skills.rest
caobingsheng
caobingshengCOMMUNITY
Explore all skills by this author →
GitHub

vue2-component-type-system

Generate JSDoc, .d.ts, and README templates for Vue2 component APIs.

1|Updated Mar 26, 2026
Search Tags:#typescript#documentation#frontend#jsdoc#component-api#dts#vue2
One-click install
npx skills add https://github.com/caobingsheng/skills --skill vue2-component-type-system
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: vue2-component-type-system
Source: https://github.com/caobingsheng/skills/tree/main/skills/vue2-component-type-system
Command: npx skills add https://github.com/caobingsheng/skills --skill vue2-component-type-system

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Vue2 component types and documentation are often under-specified, making AI-driven development and code generation error-prone. This Skill provides a disciplined three-layer approach to define, document, and surface component APIs for reliable AI understanding.

Core Features & Use Cases

  • Three-layer architecture: JSDoc in Vue components, TypeScript declaration files (.d.ts), and README documentation to align human and AI understanding.
  • AI-ready surface: precise props/events/slots typing and usage guidance to improve code generation and IDE support.
  • Use cases include onboarding new Vue2 components, generating type-safe wrappers, and debugging AI-generated integration code.

Quick Start

Add JSDoc comments to your Vue2 components, create corresponding .d.ts declarations, and document usage in a README to enable AI understanding and consistent code generation.

Frequently Asked Questions about vue2-component-type-system

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

FAQPage Schema
How do I generate TypeScript definitions and JSDoc for Vue2 components?▼

To generate TypeScript definitions and JSDoc for Vue2 components, apply a three-layer architecture that aligns JSDoc comments, .d.ts declaration files, and README templates to define precise props, events, and slots typing.

Why does AI generate incorrect integration code for my Vue2 components?▼

AI generates incorrect Vue2 integration code because component types and documentation are often under-specified. Providing structured type information and precise API documentation ensures accurate AI understanding and reliable code generation.

What is the best way to document Vue2 component APIs for AI code generation?▼

The best way to document Vue2 component APIs for AI code generation is using a three-layer approach: JSDoc in components, TypeScript .d.ts declarations, and README documentation to align human and AI understanding.

How do I create type-safe wrappers for existing Vue2 components?▼

To create type-safe wrappers for Vue2 components, generate structured type information and .d.ts declaration files that provide precise typing for props, events, and slots, enabling consistent component integration and IDE support.

Do I need TypeScript in my Vue2 project to use .d.ts declaration files?▼

You do not need a full TypeScript Vue2 project to use .d.ts files. Creating standalone TypeScript declaration files alongside JSDoc comments surfaces precise component APIs for IDE support and AI code generation.

Can I use JSDoc and .d.ts files together to document Vue2 component slots and events?▼

Yes, you can use JSDoc and .d.ts files together to document Vue2 component slots and events. This three-layer architecture aligns frontmatter-driven naming across JSDoc, d.ts, and README layers for precise API typing.

Related Skills

Explore More Software Engineering Skills→
aziontechaziontech
22

storybook-update-component

Update Vue Storybook stories to reflect component prop, slot, and event changes.

Official
Advanced
luyi985luyi985

accurate-environment-model

Create .d.ts declaration files for global variables, window properties, and environment constants.

Community
Advanced
luissimon96luissimon96

graph-docs

Audit documentation health by validating JSDoc, README, and CLAUDE.md conventions.

Community
Advanced
ruan-catruan-cat

code-migration

Migrate Vue2 Options API projects to Vue3 Composition API with TypeScript.

Community
Advanced