ReddRadar
Agent skill
vue-best-practices
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.
Install this agent skill to your Project
npx add-skill https://github.com/Dwsy/agent/tree/main/skills/vue-best-practices
Metadata
Additional technical details for this skill
- author
- hyf0
- version
- 8.0.0
SKILL.md
Capability Rules
| Rule | Keywords | Description |
|---|---|---|
| extract-component-props | get props type, wrapper component, extend props, inherit props, ComponentProps | Extract types from .vue components |
| vue-tsc-strict-templates | undefined component, template error, strictTemplates | Catch undefined components in templates |
| fallthrough-attributes | fallthrough, $attrs, wrapper component | Type-check fallthrough attributes |
| strict-css-modules | css modules, $style, typo | Catch CSS module class typos |
| data-attributes-config | data-*, strictTemplates, attribute | Allow data-* attributes |
| volar-3-breaking-changes | volar, vue-language-server, editor | Fix Volar 3.0 upgrade issues |
| module-resolution-bundler | cannot find module, @vue/tsconfig, moduleResolution | Fix module resolution errors |
| define-model-update-event | defineModel, update event, undefined | Fix model update errors |
| with-defaults-union-types | withDefaults, union type, default | Fix union type defaults |
| deep-watch-numeric | watch, deep, array, Vue 3.5 | Efficient array watching |
| vue-directive-comments | @vue-ignore, @vue-skip, template | Control template type checking |
| vue-router-typed-params | route params, typed router, unplugin | Fix route params typing |
Efficiency Rules
| Rule | Keywords | Description |
|---|---|---|
| hmr-vue-ssr | hmr, ssr, hot reload | Fix HMR in SSR apps |
| pinia-store-mocking | pinia, mock, vitest, store | Mock Pinia stores |
Reference
Recommended Agent Skills
Expand your agent's capabilities with these related and highly-rated skills.
Dwsy/agent
undo-redo
Use the undo_redo tool to rewind or reapply buffered file changes or inspect diffs without UI navigation. Use when you need to adjust or verify changes in the current session history.
Dwsy/agent
exa
使用 Exa.ai API 进行高质量的互联网搜索。需要 EXA_API_KEY 环境变量。
Dwsy/agent
backend-unit-test
后端单元测试技能。触发场景： - 用户要求运行/创建单元测试 - 用户要求验证数据 - 用户要求用 Maven 运行测试 - 关键词：test, maven test, junit, springboot test, 单元测试, 测试验证 核心：不改 pom，用 reactor 模式运行。
Dwsy/agent
mermaid-flow-image
将流程需求整理为可渲染的 Mermaid（简化版/详细版），并通过 Kroki 生成可发送的高分辨率 PNG 图片。适用于“把架构流程画出来并直接发图”的场景。
Dwsy/agent
web-browser
Allows to interact with web pages by performing actions such as clicking buttons, filling out forms, and navigating links. It works by remote controlling Google Chrome or Chromium browsers using the Chrome DevTools Protocol (CDP). When Claude needs to browse the web, it can use this skill to do so.
Dwsy/agent
ralph-loop-gen
任务管理系统模板生成器 - 根据用户输入或JSON配置生成完整的任务管理结构（模板生成器，非直接执行器）
Didn't find tool you were looking for?