2.9 KiB
2.9 KiB
Vue Vite Template — Agent Contract
Goal
Use this template with deterministic rules so AI agents can deliver features quickly with minimal guessing.
Command Contract
Use pnpm only.
pnpm dev # Start dev server
pnpm build # Build production assets
pnpm type-check # TypeScript check (vue-tsc)
pnpm lint # ESLint
pnpm check # Required gate: type-check + lint
Task Entry (always follow)
- Confirm target template and feature goal in one sentence.
- Locate the matching module area (
pages,components,lib,router). - Reuse existing patterns from
src/examplesandsrc/components/ui. - Implement with framework-native style (Vue Composition API +
<script setup lang="ts">). - Run
pnpm checkbefore finalizing.
Isomorphic Structure Mapping
Use these module locations in this Vue template:
| Concern | Vue location |
|---|---|
| Route pages | src/pages/*.vue |
| Shared components | src/components/** |
| API client | src/lib/api.ts |
| Service helpers | src/lib/services.ts |
| Utilities | src/lib/utils.ts |
| Router registry | src/router/index.ts |
| Examples entry page | src/pages/ExamplesPage.vue |
| Examples route | /#/examples |
Minimal Delivery Paths
New page (5 steps)
- Create
src/pages/<FeatureName>.vue. - Add route in
src/router/index.tswith path + component. - Use existing UI primitives from
src/components/ui. - If data is required, call service functions via
src/lib/services.ts. - Run
pnpm check.
New component (4 steps)
- Create component under
src/components/(orsrc/components/ui/for primitives). - Type all props/emits explicitly.
- Keep styling Tailwind-first and merge classes via
cnwhen needed. - Run
pnpm check.
New API flow (4 steps)
- Define/extend endpoint calls in
src/lib/api.tsor service module. - Add typed service wrapper in
src/lib/services.ts. - Consume via page/component using
useApistyle pattern. - Run
pnpm check.
Allowed Changes
src/pages/**,src/components/**,src/lib/**,src/router/**- Template docs (
AGENTS.md, templateREADMEif present) - Template-local config required for feature delivery
Forbidden Changes
- Do not copy
src/examples/*into production files verbatim. - Do not change package manager (
pnpmis mandatory). - Do not add parallel agent rule docs (this file is the single source).
- Do not introduce framework-mixed patterns (keep Vue idioms only).
Pre-submit Checklist
pnpm checkpasses in this template.- If template metadata/version changed, validate related metadata files before release.
- New route/page/API follows the mapping table and naming conventions.
src/examplesremains reference-only.