vue-best-practices

Enforce Vue 3 and TypeScript best practices across Vue components.

Updated Jan 29, 2026
One-click install
npx skills add https://github.com/peterWang123589/rubin_forum --skill vue-best-practices-peterwang123589
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: vue-best-practices
Source: https://github.com/peterWang123589/rubin_forum/tree/main/.opencode/skills/vue-best-practices
Command: npx skills add https://github.com/peterWang123589/rubin_forum --skill vue-best-practices-peterwang123589

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps teams enforce Vue 3 and TypeScript best practices across Vue components, ensuring consistent typing and reliable code.

Core Features & Use Cases

  • Guidelines for typing props, emits, and slots to ensure correct TypeScript integration with Vue components.
  • Wrapper component and prop extraction guidance to improve reuse without sacrificing type safety.
  • Template type checking and Volar configuration to catch issues early during development and IDE checks.

Quick Start

Provide a Vue component sample or project snippet and I will assess it against Vue, TS, and Volar best practices, returning a tailored checklist and recommended fixes.

Frequently Asked Questions about vue-best-practices

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

FAQPage Schema
How do I enforce Vue 3 and TypeScript best practices for component props extraction?

To enforce Vue 3 and TypeScript best practices for props extraction, you provide a Vue component sample to receive a tailored checklist and recommended fixes ensuring correct typing patterns and reliable code.

What is the best way to configure Volar for Vue template type checking?

Configuring Volar for Vue template type checking involves integrating consistent Vue compiler options to catch issues early during development and IDE checks, ensuring correct typing patterns across your components.

How do I create wrapper components in Vue 3 without sacrificing type safety?

Creating wrapper components in Vue 3 without sacrificing type safety requires applying specific prop extraction guidance and wrapper behavior validation to improve reusability while maintaining strict TypeScript integration.

Can I use this to review existing Vue components for TypeScript typing patterns?

Yes, you can review existing Vue components for TypeScript typing patterns by providing a project snippet to be assessed against Vue, TS, and Volar best practices, returning recommended fixes.

Why does my Vue 3 TypeScript wrapper component fail template type checking?

Vue 3 TypeScript wrapper components fail template type checking when compiler options and Volar configuration are inconsistent, preventing early issue detection during development and IDE checks.

Does Vue 3 with TypeScript require specific guidelines for typing emits and slots?

Vue 3 with TypeScript requires specific guidelines for typing emits and slots to ensure correct TypeScript integration with Vue components, satisfying requirements for consistent typing patterns across your project.