Vue Component Generator - Auto-activating skill for Frontend Development. Triggers on: vue component generator, vue component generator Part of the Frontend Development skill category.
35
3%
Does it follow best practices?
Impact
95%
1.00xAverage score across 3 eval scenarios
Passed
No known issues
Optimize this skill with Tessl
npx tessl skill review --optimize ./planned-skills/generated/05-frontend-dev/vue-component-generator/SKILL.mdQuality
Discovery
7%Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.
This description is essentially a boilerplate auto-generated stub with no meaningful content. It fails to describe what the skill actually does, provides no natural trigger terms beyond the skill name repeated, and lacks any 'Use when...' guidance. It would be nearly indistinguishable from other frontend skills in a large skill library.
Suggestions
Add specific concrete actions the skill performs, e.g., 'Generates Vue 3 single-file components with script setup, template, and scoped styles. Scaffolds props, emits, composables, and slot definitions.'
Add an explicit 'Use when...' clause with natural trigger terms, e.g., 'Use when the user asks to create a Vue component, scaffold a .vue file, generate a Vue SFC, or build a Vue template with composition API.'
Remove the duplicate trigger term and expand with natural variations users would say, such as 'Vue component', 'Vue SFC', '.vue file', 'create Vue template', 'Vue 3 component', 'composition API component'.
| Dimension | Reasoning | Score |
|---|---|---|
Specificity | The description names the domain ('Vue Component Generator', 'Frontend Development') but describes no concrete actions. There are no specific capabilities listed such as 'creates single-file components', 'generates props/emits', or 'scaffolds templates'. | 1 / 3 |
Completeness | The description barely addresses 'what' (just the name 'Vue Component Generator') and has no explicit 'when' clause. There is no 'Use when...' guidance, which per the rubric should cap completeness at 2 at best, but even the 'what' is too weak to merit a 2. | 1 / 3 |
Trigger Term Quality | The only trigger terms listed are 'vue component generator' repeated twice. It misses natural user phrases like 'create a Vue component', 'Vue SFC', '.vue file', 'Vue template', 'scaffold component', or 'Vue 3 composition API'. | 1 / 3 |
Distinctiveness Conflict Risk | The mention of 'Vue' provides some specificity that distinguishes it from generic frontend or React skills, but 'Frontend Development' is broad and could overlap with other frontend skills. The lack of detailed triggers increases conflict risk. | 2 / 3 |
Total | 5 / 12 Passed |
Implementation
0%Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.
This skill is essentially a placeholder template with no actual instructional content. It repeatedly references 'vue component generator' without ever providing concrete guidance, code examples, Vue component patterns, or any actionable information. The entire body is meta-description about what the skill could do rather than actually doing it.
Suggestions
Replace the abstract descriptions with actual Vue component generation guidance, including executable code examples (e.g., a Vue 3 SFC template with <script setup>, props, emits, and slots).
Add a concrete workflow: 1) Define component API (props/emits), 2) Write template, 3) Add composition logic, 4) Validate with TypeScript/linting—with specific commands and code at each step.
Include at least 2-3 concrete examples showing input requirements and expected output Vue components (e.g., 'Given a data table requirement, generate this component').
Remove all meta-sections like 'When to Use', 'Example Triggers', and 'Capabilities' that describe the skill rather than teach it, and replace with actionable content covering Vue best practices, Composition API patterns, and component design principles.
| Dimension | Reasoning | Score |
|---|---|---|
Conciseness | The content is entirely filler and meta-description. It explains what the skill does in abstract terms without providing any actual technical content. Every section restates the same vague information about 'vue component generator' without adding substance. | 1 / 3 |
Actionability | There is zero concrete guidance—no code examples, no commands, no Vue component templates, no API patterns, nothing executable. The skill describes rather than instructs, offering only vague promises like 'provides step-by-step guidance' without actually providing any. | 1 / 3 |
Workflow Clarity | No workflow is defined at all. There are no steps, no sequences, no validation checkpoints. The content merely states it 'provides step-by-step guidance' without including any actual steps. | 1 / 3 |
Progressive Disclosure | The content is a flat, repetitive document with no meaningful structure. There are no references to detailed files, no quick-start section with real content, and no navigation to deeper resources. The sections are all meta-descriptions that repeat the same information. | 1 / 3 |
Total | 4 / 12 Passed |
Validation
81%Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.
Validation — 9 / 11 Passed
Validation for skill structure
| Criteria | Description | Result |
|---|---|---|
allowed_tools_field | 'allowed-tools' contains unusual tool name(s) | Warning |
frontmatter_unknown_keys | Unknown frontmatter key(s) found; consider removing or moving to metadata | Warning |
Total | 9 / 11 Passed | |
3076d78
Table of Contents
If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.