vue-debug-guides
78Debug Vue 3 Issues Faster
Vue 3 errors often come from subtle reactivity, lifecycle, async, or SSR behavior. This skill gives Claude and Codex focused guides for diagnosing those issues and choosing safer fixes.
Improve Vue 3 TypeScript Practices
Vue TypeScript projects often hit confusing template, router, and Volar errors. This skill gives targeted Vue 3 fixes for Codex, Claude, and Claude Code.
Copy this request to your Agent. It includes the canonical Skill page and manifest.
Review the Skillstore skill "vue-best-practices" from https://skillstore.io/skills/hyf0-vue-best-practices.md and its manifest at https://skillstore.io/api/skills/hyf0-vue-best-practices/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.Your Agent should still show its plan and request any confirmation required by the security policy.
Use these links when an AI agent, crawler, or script needs clean context instead of reading the full page.
Using "vue-best-practices". A Vue component shows undefined component errors in templates.
Expected outcome:
Using "vue-best-practices". A route page cannot access its id route parameter.
Expected outcome:
The skill identifies the typed route union issue, recommends route-specific typing, and warns when broad assertions hide real errors.
Using "vue-best-practices". HMR breaks after editing script setup in SSR mode.
Expected outcome:
The static findings are false positives caused by documentation examples, markdown code fences, and reference links. I found no prompt injection, data exfiltration intent, or unauthorized execution behavior in the cited files.
Share the versioned assessment report, neutral badge, embed card, and citations. Skillstore reports evidence without deciding whether this Skill is safe.
https://skillstore.io/skills/hyf0-vue-best-practices/audits/4?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report[](https://skillstore.io/skills/hyf0-vue-best-practices?utm_source=security_passport_badge)<a href="https://skillstore.io/skills/hyf0-vue-best-practices?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/hyf0-vue-best-practices/security.svg" alt="Skillstore security assessment" loading="lazy"></a><iframe src="https://skillstore.io/embed/skills/hyf0-vue-best-practices.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>hyf0. (2026). vue-best-practices security audit report (audit version 4) [Author version 8.0.0]. Skillstore. https://skillstore.io/skills/hyf0-vue-best-practices/audits/4@techreport{hyf0-hyf0-vue-best-practices-2026,
author = {hyf0},
title = {vue-best-practices security audit report (audit version 4)},
institution = {Skillstore},
year = {2026},
number = {4},
url = {https://skillstore.io/skills/hyf0-vue-best-practices/audits/4},
note = {Author version 8.0.0}
}cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "vue-best-practices security audit report (audit version 4)"
version: "8.0.0"
type: report
authors:
- name: "hyf0"
date-released: "2026-07-06"
url: "https://skillstore.io/skills/hyf0-vue-best-practices/audits/4"
identifiers:
- type: other
value: "skillstore:hyf0-vue-best-practices:audit:4"
description: "Skillstore immutable audit report identifier"
Each author remains a separate installable skill. The recommended variant is ranked by Skillstore evidence.
Why this variant is first
vuejs-ai-vue-best-practices
2026-08-21
hyf0-vue-best-practices
2026-08-21
antfu-vue-best-practices
2026-08-21
Diagnose strict template errors, missing component types, data attributes, and compiler option gaps.
Type wrapper components, fallthrough attributes, component props, emits, and CSS module access.
Plan Volar upgrades, Vite plugin cleanup, SSR HMR fixes, and module resolution changes.
Review my Vue 3 component for TypeScript and template type issues. Explain the likely cause and the smallest safe fix.
Help me fix Vue Router typed params in this page. Use route-specific typing and avoid broad assertions when possible.
Review these wrapper components for prop extraction, fallthrough attributes, emits typing, and CSS module mistakes.
Create a migration plan for Volar 3 and vue-tsc in this repository. Include editor settings, package checks, and rollback notes.
Author
hyf0License
MIT
Author version
v8.0.0
Skillstore revision
r1
Ref
a06681402992ceae98ba04d54cfd4ab004862696
Maintenance freshness
7/18/2026
Usage
35 downloads ยท 297 views
File structure
๐ rules/
๐ codeactions-save-performance.md
๐ data-attributes-config.md
๐ define-model-update-event.md
๐ duplicate-plugin-detection.md
๐ extract-component-props.md
๐ fallthrough-attributes.md
๐ hmr-vue-ssr.md
๐ module-resolution-bundler.md
๐ volar-3-breaking-changes.md
๐ vue-directive-comments.md
๐ vue-router-typed-params.md
๐ vue-tsc-strict-templates.md
๐ with-defaults-union-types.md
๐ SKILL.md
Improve Vue Options API Code
by vuejs-ai
Vue Options API projects often lose type safety and correct this binding. This skill gives focused rules for safer Vue 3 components.
Build Frontend Apps Faster
by davila7
Frontend work often needs consistent React patterns, performance checks, and project scaffolding. This skill gives Claude and compatible agents practical guidance and local helper scripts for modern web application development.
Create Adaptable Vue Composables
by vuejs-ai
Vue composables often need to accept plain values, refs, computed values, or getters. This skill guides Claude, Codex, and Claude Code to design reusable composables with predictable reactivity.
Improve Vue Router Navigation
by antfu
Vue Router mistakes can cause stale data, redirect loops, and unreliable navigation. This skill provides focused Vue Router 4 patterns for implementation and review.
Build Reliable Playwright Tests
by C0ntr0lledCha0s
Playwright test suites can become flaky, slow, and difficult to maintain. This skill provides practical patterns for locators, fixtures, page objects, debugging, mocking, and configuration.
Build Starknet Apps with starknet.js
by internet-court
Starknet integrations require precise provider, account, transaction, and fee handling across several APIs. This skill provides focused starknet.js v9.x patterns for reliable TypeScript applications.