Vue 3 and Nuxt 3 Rules

When to use this

Place this file in Vue 3 or Nuxt 3 web applications to enforce Composition API with <script setup>, Pinia stores, and strict type safety.

The template

# AGENTS.md

## Project Context

Nuxt 3 web application using Vue 3 Composition API, TypeScript, Pinia, and Tailwind CSS.

## Commands

- `npm run dev` start Nuxt development server
- `npx nuxi typecheck` run Vue compiler type checks
- `npm run test` run Vitest component test suite

Run `npx nuxi typecheck` before finishing tasks.

## Conventions

- Write components using Vue 3 `<script setup lang="ts">`. Options API is forbidden.
- Manage global state via Pinia stores under `stores/`.
- Use Nuxt auto-imports (`useFetch`, `useAsyncData`) for server data fetching.
- Ensure props and emits are explicitly typed using TypeScript interfaces.

## Restrictions

- Do not manipulate DOM nodes directly using `document.querySelector`; use Vue `ref`.
- Do not mutate props inside child components.

## Approval Required

- Adding new Nuxt modules or external npm libraries.
- Modifying Nuxt router or middleware configurations.

Customization Guide

Customize dependencies and store directory structures for pure Vue vs Nuxt projects.