---
type: rule
name: limite-linhas
description: Nenhum arquivo de código pode ultrapassar 250 linhas
scope: global
trigger: file_match
globs:
  - "**/*.ts"
  - "**/*.tsx"
  - "**/*.vue"
  - "**/*.css"
updatedAt: "2026-06-01"
---

# Regra: Limite de 250 Linhas por Arquivo

## Regra

Nenhum arquivo `*.vue`, `*.ts`, `*.tsx` ou `*.css` pode ultrapassar **250 linhas**.

> Validação automática: `verificar-linhas.sh`

## Estratégias de Decomposição

| Situação | Ação |
|---|---|
| Template longo | Extrair seções como subcomponentes |
| CSS extenso | Mover para `<nome>.css` co-localizado |
| `setup()` extenso | Extrair subcomponentes, CSS ou Dispatch Table |
| Modal/Dialog embutido | Sempre em componente separado (`*Modal.vue`) |
| Handlers e dispatch | Extrair para `handlers.ts` ou `dispatch.ts` |

## Divisão em Pasta

Quando um componente precisa de múltiplos sub-arquivos, converter em **pasta homônima** com `index.vue`:

```
# Antes
ComponenteGrande.vue                ← monolítico (+250 linhas)

# Depois
ComponenteGrande/
├── index.vue                       ← orquestração (≤250 linhas)
├── SecaoPrincipal.vue              ← bloco de template extraído
├── SecaoSecundaria.vue             ← outro bloco extraído
├── componenteGrande.mapeadores.ts  ← lógica de eventos
└── ComponenteGrande.css            ← estilos co-localizados
```

| Arquivo | Responsabilidade |
|---|---|
| `index.vue` | Orquestração: importa e compõe. Sem lógica densa. |
| `Secao*.vue` | Template isolado. Props + eventos. |
| `*.mapeadores.ts` | Funções de ação desacopladas. |
| `*.css` | Estilos co-localizados. |

> Importações externas não mudam: `ComponenteGrande/` resolve para `index.vue`.

## Impacto

Sem esta regra, arquivos crescem silenciosamente até se tornarem intocáveis — ninguém quer revisar ou refatorar um componente de 800 linhas.

## Referências

- Script: `verificar-linhas.sh`
- Workflow: `global/workflows/otimizar-codigos`
