Files
don_confiao_frontend/AGENTS.md

2.4 KiB

Don Confiao - Frontend

Tech Stack

  • Framework: Vue 3 (Composition API)
  • UI Library: Vuetify 3
  • Routing: Vue Router 4 (auto-routes con unplugin-vue-router)
  • State: Pinia
  • HTTP: Axios
  • Build: Vite
  • Linting: ESLint

Project Structure

src/
├── assets/          # Imágenes, iconos estáticos
├── components/      # Componentes Vue reutilizables
├── layouts/         # Layouts de página
├── pages/           # Vistas (auto-routed desde文件名)
├── plugins/         # Configuración de Vuetify, etc.
├── router/          # Configuración de rutas
├── services/        # API services (auth.js, etc.)
├── stores/          # Pinia stores
└── styles/          # SCSS settings

Important Conventions

Auto-imports

  • Componentes en src/components/ se auto-importan por nombre
  • Los archivos en src/pages/*.vue se routing automáticamente via unplugin-vue-router
  • Alias @ = src/

Pages (CRITICAL)

Siempre importar componentes en los archivos de página:

<template>
  <MiComponente />
</template>

<script setup>
import MiComponente from '@/components/MiComponente.vue';
</script>

Componentes

  • Usar Composition API (<script setup> o export default { })
  • Naming: PascalCase (ej: LoginDialog.vue, CartGrid.vue)
  • Componentes de página van en pages/, componentes reutilizables en components/

Servicios API

  • Ubicación: src/services/
  • Usar Axios para HTTP requests
  • JWT tokens en localStorage (access_token, refresh_token)

Routing

  • Rutas automáticas basadas en archivos en src/pages/
  • No requiere configuración manual en router/index.js

Environment Variables

  • VITE_DJANGO_BASE_URL - URL del backend Django

Commands

npm run dev      # Desarrollo (puerto 3000)
npm run build    # Producción
npm run preview  # Preview build
npm run lint     # ESLint fix

Common Issues

  1. Página en blanco: Verificar que los componentes en src/pages/*.vue tengan import explícito
  2. Errores de lint: Ejecutar npm run lint

Git Commits

Antes de hacer commit:

  1. Pedir permiso al usuario
  2. Mostrar resumen de los cambios que se incluirán

Formato de mensajes:

  • Usar prefijo #<numero> para referenciar el issue (ej: #28 feat: add login donde #28 es el número del issue en GitHub/GitLab)
  • Prefijos válidos: feat, fix, chore, docs, refactor, style