vue-refactor

What problem does it solve?

This Skill acts as a diagnostic and coaching assistant for refactoring Vue code. It analyzes a given Vue component or SFC, identifies common pain points like a too-fat main branch, UI/IO entanglement, or reactive-business entanglement, and prescribes one of three safe decoupling strategies. It guides through compiler-driven steps to keep behavior equivalent and to return the codebase to a green state, always prioritizing incremental, auditable moves with rollbacks.

Core Features & Use Cases

• Diagnostic decision tree: detects fat trunk, UI/IO entanglement, and reactive-business coupling.
• Prescription-driven refactor: chooses one of three safe recipes (outward move, humble/controller split, thin composable) and guides step-by-step.
• Compiler-guided execution: ensures each micro-move preserves external behavior with green compilations and clear rollback points.
• Collaboration rhythm: presents a paused, decision-point workflow for incremental, auditable changes.

Quick Start

Paste a Vue component path or code snippet; the Skill will diagnose the fat trunk and IO/reactivity entanglements and propose a prescription with incremental steps.