Can I use this for projects without TypeScript?

While it can be adapted, the skill is designed with a 'TypeScript-first' philosophy to ensure maximum runtime safety and developer productivity.

Why is defineModel emphasized in this skill?

defineModel significantly reduces boilerplate for two-way data binding, replacing manual modelValue props and update emits with a single type-safe line.

How does this skill improve Vue testing?

It enforces the use of @testing-library/vue and MSW, focusing on testing user-visible behavior rather than internal component state or implementation details.

Does this skill support Vue 2 projects?

No, this skill is specifically optimized for Vue 3 using the Composition API and modern script setup patterns.

Vue 3 Modern Development

Name: Vue 3 Modern Development
Author: daveharmswebdev

bydaveharmswebdev

Developer Tools

Enforces modern Vue 3 patterns and TypeScript-first architectures for robust, testable frontend development.

About

This skill provides a comprehensive framework for building high-quality Vue 3 applications using the Composition API. It prioritizes type safety, modern APIs like defineModel, and user-centric testing patterns while actively preventing the use of legacy anti-patterns. By integrating a mandatory research protocol and strict development workflows, it ensures that Claude implements components, composables, and routing logic that are maintainable, production-ready, and aligned with the latest official Vue documentation.

Key Features

User-behavior testing patterns using Testing Library and MSW mocking
Red-flag detection for legacy Vue 2 patterns and runtime validation
Automated migration from manual v-model boilerplate to defineModel
Standardized routing and composable architecture workflows
0 GitHub stars
Strict TypeScript-first implementation for props, emits, and models

Use Cases

Architecting new Vue 3 features with type-safe state management
Implementing integration tests that verify user-visible behavior over internals
Refactoring legacy Options API components to modern Composition API

About

Key Features

User-behavior testing patterns using Testing Library and MSW mocking
Red-flag detection for legacy Vue 2 patterns and runtime validation
Automated migration from manual v-model boilerplate to defineModel
Standardized routing and composable architecture workflows
0 GitHub stars
Strict TypeScript-first implementation for props, emits, and models

Use Cases

Architecting new Vue 3 features with type-safe state management
Implementing integration tests that verify user-visible behavior over internals
Refactoring legacy Options API components to modern Composition API