vue-componentes/.agent/rules/vue-limite-linhas.global.md

1.7 KiB

Regra: Limite de Linhas em Arquivos Vue

🎯 Regra

Nenhum arquivo *.vue deve ultrapassar 250 linhas.


Motivação

Arquivos Vue longos acumulam múltiplas responsabilidades:

  • template, lógica e estilo no mesmo arquivo
  • componentes internos não reutilizáveis
  • dificuldade de teste e manutenção

O limite de 250 linhas é uma fronteira de manutenibilidade, não apenas de estética.


Aplicação automática

O script scripts/check-vue-linhas.sh valida este limite em todo pnpm run build.
Arquivos legados em processo de refatoração estão listados como isentos temporários dentro do script.


Obrigações do agente

Antes de criar um novo arquivo Vue

  • Estimar o tamanho do componente
  • Se a estimativa ultrapassar 250 linhas, quebrar em subcomponentes imediatamente

Ao editar um arquivo Vue existente

  • Verificar o total de linhas atual antes de adicionar código
  • Se a edição levar o arquivo acima de 250 linhas, propor extração de subcomponente

Ao identificar um arquivo isento

  • Sinalizar ao operador que o arquivo é legado e deve ser refatorado
  • Não adicionar mais linhas a arquivos isentos sem refatorar algo equivalente

Estratégias de extração obrigatórias

Quando um arquivo se aproximar do limite:

Situação Ação
Template longo Extrair seções como <NomeSecao /> próprio componente
CSS extenso Mover para arquivo .css co-localizado e importar
Setup() > 100 linhas Extrair lógica para composable use*.ts co-localizado
Modal/Dialog embutido Sempre em componente separado (*Modal.vue)

Não existem isentos. Todos os arquivos Vue da biblioteca respeitam o limite de 250 linhas.