mcpField
V
vue-best-practices

vue-best-practices

github.com/frankiglesiasDevelopment0187 installsUpdated 36w ago
Repository

About vue-best-practices

Vue Best Practices is a rulebook skill for addressing common Vue 3 anti-patterns in production applications. It guides coding agents through selecting relevant rules, making minimal changes, and checking project behavior and quality commands.

Key features

  1. 01Vue 3 anti-pattern guidance
  2. 02Rule selection by issue
  3. 03Incremental safe changes
  4. 04Project-specific state patterns
  5. 05Lint, test, and build checks

Use cases

  1. 01Fix common Vue 3 anti-patterns
  2. 02Review code against repository rules
  3. 03Keep production fixes narrowly scoped

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/frankiglesias/vue-best-practices --skill vue-best-practices

After installing, type/vue-best-practicesin Claude Code to confirm it loaded.

Bundled files

References and scripts installed along with SKILL.md.

AGENTS.md
rules/
avoid-any-in-public-component-apis.md
avoid-deep-watchers.md
avoid-fetch-in-mounted.md
avoid-global-component-registration.md
avoid-importing-vue-compiler-macros.md
avoid-mutable-singletons.md
avoid-mutating-props.md
cancel-stale-requests.md
cleanup-side-effects.md
defer-third-party-scripts.md
follow-eslint-format-contract.md
guard-browser-apis-on-server.md
handle-optional-data-safely.md
isolate-direct-dom-access.md
lazy-load-routes-and-heavy-components.md
move-data-logic-to-composables.md
prefer-computed-for-derived-state.md
prefer-tree-shakable-imports.md
prevent-hydration-mismatch.md
prevent-request-waterfalls.md
split-large-reactive-objects.md
stabilize-v-for-keys.md
type-composables-and-emits.md
use-onerrorcaptured-boundaries.md

Details

From the project README

Vue Best Practices

Use this skill as a rulebook for fixing common Vue 3 anti-patterns in production apps.

Workflow

  1. Open AGENTS.md.
  2. Select only the relevant rule files from rules/.
  3. Apply the smallest safe change that resolves the issue.
  4. Re-check behavior and run the project's lint, test, and build checks.

Repository Guardrails

  • Use Vue 3 Composition API with <script setup lang="ts">.
  • Follow the existing state-management pattern already used by the project (Vuex, Pinia, etc.).
  • Do not create new global components.
  • Do not add comments unless the user explicitly asks for them.
  • Do not import Vue compiler macros (defineProps, defineEmits, defineExpose, withDefaults) from vue.
  • Match ESLint style defaults in this repo: semicolons, single quotes, trailing commas for multiline, 2-space indent.

Output Expectations

  • Explain which rules were applied and why.
  • Prefer composables and pure utilities over ad-hoc component logic.
  • Keep changes incremental; avoid broad rewrites unless asked.

Comments

Markdown supported