Skills Agentes

Vue Router Best Practices

Patrones de Vue Router 4, navigation guards, parámetros de ruta e interacciones del ciclo de vida ruta-componente.

Estrellas
5.9k

en todo el repo

Actividad
35

0–100, la ruta de este skill

Actualizado
hace 6 meses

último commit aquí

Commits
0

últimos 90 días

Contexto
373 tok

25 tok en reposo

Paquete
11 archivos

43 KB

Instalar

Funciona con cualquier agente que lea SKILL.md

npx -y skills add antfu/skills --skill vue-router-best-practices --agent claude-code

Se instala solo en este repositorio.

Qué hace

  • Aplica patrones de Vue Router 4 para navigation guards, cambios de parámetros de ruta y ciclo de vida de rutas/componentes
  • Ofrece referencias específicas para bugs comunes como bucles de redirección infinitos o uso de next() obsoleto
  • Corrige guards que no esperan (await) llamadas a la API dentro de navigation guards
  • Ayuda a evitar datos obsoletos o listeners que persisten tras cambiar de ruta o desmontar componentes

Úsalo cuando

  • Navegar entre la misma ruta con distintos params sin que se dispare beforeEnter
  • Acceder a la instancia del componente dentro de beforeRouteEnter
  • Detectar bucles de redirección infinitos que dejan a los usuarios atrapados
  • Construir una single-page application de producción con Vue Router

No lo uses cuando

    Qué lo activa

    Di cualquiera de estas frases y el agente debería cargar este skill.

    • “¿Por qué beforeEnter no se dispara al cambiar solo el param de la ruta?”
    • “Tengo un bucle infinito de redirecciones en mis navigation guards de Vue Router”
    • “¿Cómo accedo a `this` dentro de beforeRouteEnter?”
    • “Los listeners de eventos siguen activos después de desmontar el componente de la ruta”

    SKILL.md

    En inglés

    Vue Router best practices, common gotchas, and navigation patterns.

    Navigation Guards

    Route Lifecycle

    Setup

    Reproducido de antfu/skills bajo licencia MIT. Leer esta página en markdown.

    Archivos

    11 archivos en el paquete. Solo se lee SKILL.md al activarse — las referencias se cargan si el skill decide que las necesita.

    Detalles

    Creador
    antfu
    Licencia
    MIT
    Recursos incluidos
    Incluye scripts o referencias
    Repositorio
    antfu/skills
    Código fuente
    Ver SKILL.md

    Etiquetas

    Más de antfu/skills

    Este repo incluye 19 skills. Si instalas uno, normalmente ya tienes los demás. Ver el pack skills entero y su comando de instalación

    Antfu

    5.9k

    Herramientas y convenciones de Anthony Fu para proyectos JavaScript/TypeScript: configuración de ESLint, monorepos y publicación de librerías.

    Costo de contexto al activarse
    1.3k tok
    Tamaño del paquete
    6 archivos
    Última actualización
    hace 3 meses
    herramientas desarrollo

    Convenciones de diseño estilo antfu: tokens semánticos basados en clases con UnoCSS para light/dark, más reglas anti-slop y de micro-interacción para devtools y landing pages.

    Costo de contexto al activarse
    1.3k tok
    Tamaño del paquete
    15 archivos
    Última actualización
    hace 3 meses
    diseno ui

    Nitro

    5.9k

    Nitro es el toolkit de servidor agnóstico de framework (usado por Nuxt) para construir y desplegar servidores web en cualquier lugar: routing, config, caching, tasks, websockets y despliegue en Node/Bun/Deno/Cloudflare/Vercel.

    Costo de contexto al activarse
    880 tok
    Tamaño del paquete
    15 archivos
    Última actualización
    hace 3 meses
    desarrollo apis

    Nuxt

    5.9k

    Framework full-stack Vue con SSR, auto-imports y routing basado en archivos. Úsalo para apps Nuxt, server routes, useFetch, middleware o hybrid rendering.

    Costo de contexto al activarse
    977 tok
    Tamaño del paquete
    20 archivos
    Última actualización
    hace 3 meses
    herramientas desarrollo

    Pnpm

    5.9k

    Gestor de paquetes de Node.js con resolución estricta de dependencias. Úsalo para comandos de pnpm, pnpm-workspace.yaml, catalogs, patches, overrides, config dependencies o el global virtual store.

    Costo de contexto al activarse
    1k tok
    Tamaño del paquete
    18 archivos
    Última actualización
    hace 3 meses
    herramientas desarrollo

    Slidev

    5.9k

    Crea y presenta slidedecks web para desarrolladores con Slidev, usando Markdown, componentes Vue, resaltado de código, animaciones y funciones interactivas.

    Costo de contexto al activarse
    2.2k tok
    Tamaño del paquete
    56 archivos
    Última actualización
    hace 3 meses
    documentos

    Skills relacionados

    Optimiza la configuración del contexto del agente. Úsalo al iniciar una sesión nueva, cuando la calidad del agente empeora, al cambiar de tarea o al configurar archivos de reglas y contexto de un proyecto.

    Costo de contexto al activarse
    3.9k tok
    Tamaño del paquete
    1 archivo
    Última actualización
    el mes pasado
    herramientas desarrollo

    Gestiona la baja y migración de sistemas: retirar APIs o funciones antiguas, migrar usuarios a una nueva implementación, migrar un esquema de BD en producción (expand/contract) sin downtime, o decidir si mantener o retirar código.

    Costo de contexto al activarse
    3.2k tok
    Tamaño del paquete
    1 archivo
    Última actualización
    el mes pasado
    herramientas desarrollo

    Estructura las prácticas de flujo de trabajo en git: commits, ramas, resolver conflictos, dividir trabajo sin confirmar en commits atómicos, PRs, push, trabajo en paralelo, releases, versión semántica, tags y changelog.

    Costo de contexto al activarse
    3.5k tok
    Tamaño del paquete
    1 archivo
    Última actualización
    hace 2 meses
    herramientas desarrollo