🎯

vue-best-practices

🎯Skill

from prorise-cool/prorise-claude-skills

What it does

Enforces Vue 3 TypeScript best practices by providing comprehensive type-checking, component prop extraction, and configuration rules for Vue development.

📦

Part of

prorise-cool/prorise-claude-skills(35 items)

vue-best-practices

Installation

git cloneClone repository

git clone https://github.com/prorise/prorise-claude-skills.git

📖 Extracted from docs: prorise-cool/prorise-claude-skills

Need more details? View full documentation on GitHub →

2Installs

AddedFeb 4, 2026

View on GitHub Back to Skills

Skill Details

SKILL.md

Vue 3 and Vue.js best practices for TypeScript, vue-tsc, and Volar. This skill should be used when writing, reviewing, or refactoring Vue components to ensure correct typing patterns. Triggers on tasks involving Vue components, props extraction, wrapper components, template type checking, or Volar configuration.

Capability Rules

| Rule | Keywords | Description |

|------|----------|-------------|

| [extract-component-props](rules/extract-component-props.md) | get props type, wrapper component, extend props, inherit props, ComponentProps | Extract types from .vue components |

| [vue-tsc-strict-templates](rules/vue-tsc-strict-templates.md) | undefined component, template error, strictTemplates | Catch undefined components in templates |

| [fallthrough-attributes](rules/fallthrough-attributes.md) | fallthrough, $attrs, wrapper component | Type-check fallthrough attributes |

| [strict-css-modules](rules/strict-css-modules.md) | css modules, $style, typo | Catch CSS module class typos |

| [data-attributes-config](rules/data-attributes-config.md) | data-, strictTemplates, attribute | Allow data- attributes |

| [volar-3-breaking-changes](rules/volar-3-breaking-changes.md) | volar, vue-language-server, editor | Fix Volar 3.0 upgrade issues |

| [module-resolution-bundler](rules/module-resolution-bundler.md) | cannot find module, @vue/tsconfig, moduleResolution | Fix module resolution errors |

| [define-model-update-event](rules/define-model-update-event.md) | defineModel, update event, undefined | Fix model update errors |

| [with-defaults-union-types](rules/with-defaults-union-types.md) | withDefaults, union type, default | Fix union type defaults |

| [deep-watch-numeric](rules/deep-watch-numeric.md) | watch, deep, array, Vue 3.5 | Efficient array watching |

| [vue-directive-comments](rules/vue-directive-comments.md) | @vue-ignore, @vue-skip, template | Control template type checking |

| [vue-router-typed-params](rules/vue-router-typed-params.md) | route params, typed router, unplugin | Fix route params typing |

Efficiency Rules

| Rule | Keywords | Description |

|------|----------|-------------|

| [hmr-vue-ssr](rules/hmr-vue-ssr.md) | hmr, ssr, hot reload | Fix HMR in SSR apps |

| [pinia-store-mocking](rules/pinia-store-mocking.md) | pinia, mock, vitest, store | Mock Pinia stores |

Reference

[Vue Language Tools](https://github.com/vuejs/language-tools)
[vue-component-type-helpers](https://github.com/vuejs/language-tools/tree/master/packages/component-type-helpers)
[Vue 3 Documentation](https://vuejs.org/)

More from this repository10

🎯

documentation-specialist🎯Skill

Generates and maintains comprehensive technical documentation, API specs, code comments, and project guides across multiple documentation frameworks.

🎯

frontend-specialist🎯Skill

Expertly develops user interfaces, mobile apps, and web components using modern frontend frameworks and technologies.

🎯

gh-bootstrap🎯Skill

gh-bootstrap skill from prorise-cool/prorise-claude-skills

🎯

domain-name-brainstormer🎯Skill

Generates creative, available domain names across multiple TLDs by analyzing your project's purpose and target audience.

🎯

code-quality-specialist🎯Skill

Skill

🎯

skill-creator🎯Skill

Guides users in creating modular skills that extend Claude's capabilities through specialized workflows, tool integrations, and domain expertise.

🎯

design-specialist🎯Skill

Delivers comprehensive design expertise by providing UI/UX design, user research, visual design, and brand consistency solutions.

🎯

architecture-specialist🎯Skill

Designs comprehensive system architectures, performs technology selection, conducts architecture reviews, and creates scalable component designs for new or existing systems.

🎯

lead-research-assistant🎯Skill

Skill

🎯

product-specialist🎯Skill

Skill