Vue 3 Composition API

Category: framework October 19, 2025

Agent instructions for Vue 3 projects using Composition API and TypeScript

vuevue3composition-apitypescript
# Vue 3 Composition API Development

## Setup

- Install: `npm install` or `pnpm install`
- Dev server: `npm run dev`
- Build: `npm run build`
- Test: `npm test`

## Code Style

- Use Composition API with `<script setup>`
- TypeScript for all components
- Single File Components (.vue)
- Use `ref()` and `reactive()` appropriately
- Organize composables in `composables/` directory

## Component Structure

- Use `defineProps()` and `defineEmits()` with TypeScript
- Extract reusable logic into composables
- Keep components focused and small
- Use `computed()` for derived state
- Use `watch()` for side effects

## Testing

- Unit tests with Vitest
- Component tests with Vue Test Utils
- Run tests before committing