# Rule Writing

> Implementa reglas de React Doctor a partir de un contrato validado: reglas de oxlint, detección por sintaxis o control de flujo, tests adversariales, reutilización de utilidades del árbol sintáctico y actualización del registro de reglas.

Fuente: https://skillsagentes.com/skills/millionco/react-doctor/rule-writing
Markdown: https://skillsagentes.com/skills/millionco/react-doctor/rule-writing.md

Repositorio: https://github.com/millionco/react-doctor
Autor: millionco
Licencia: NOASSERTION
Actualizado: el mes pasado
Coste de contexto: 55 tok instalada, 522 tok al activarse, 522 tok con todos los archivos del bundle
Bundle: 1 archivo, 2 KB
Permisos que pide: ninguno declarado

## Instalación

Un skill son archivos markdown: los mismos archivos valen para cualquier agente y lo único que cambia es el directorio de destino, es decir la bandera `--agent`. Añade `-g` para instalarlo en todos los proyectos de la máquina.

```bash
# Claude Code
npx -y skills add millionco/react-doctor --skill rule-writing --agent claude-code
# Cursor
npx -y skills add millionco/react-doctor --skill rule-writing --agent cursor
# Codex
npx -y skills add millionco/react-doctor --skill rule-writing --agent codex
# Gemini CLI
npx -y skills add millionco/react-doctor --skill rule-writing --agent gemini
# Windsurf
npx -y skills add millionco/react-doctor --skill rule-writing --agent windsurf
# Cline
npx -y skills add millionco/react-doctor --skill rule-writing --agent cline
```

## Qué hace

- Implementa reglas de React Doctor a partir de un contrato validado; si no hay contrato, define uno compacto antes de editar.
- Planifica el detector: condición del diagnóstico, sintaxis y bindings necesarios, casos no soportados y tests adversariales.
- Antes de añadir un helper busca uno que reutilizar con `truffler`, y lee `docs/HOW_TO_WRITE_A_RULE.md`, reglas, utilidades y tests cercanos.
- Implementa solo el comportamiento soportado por el contrato, teniendo en cuenta alias de import, funciones anidadas, wrappers transparentes, propiedades computadas dinámicas y escape hatches del framework.
- Corre los checks del repo con `ni`/`nr` (test, lint, typecheck, format, smoke:json-report) y entrega el cambio a `rule-validate`.

## Cuándo usarla

- Al escribir reglas de oxlint, planificar detección por sintaxis o control de flujo, diseñar tests adversariales, reutilizar utilidades del árbol sintáctico o actualizar el registro de reglas.

## Qué la activa

- "Implementa la regla a partir de este contrato de rule-research"
- "Escribe un detector de sintaxis para este patrón y sus tests adversariales"
- "Actualiza el registro de reglas con la nueva regla"

## Antes de instalar

- Se ejecuta en el repo de React Doctor con comandos `@antfu/ni` (`nr test`, `nr lint`, `nr typecheck`, `nr format`).

## Archivos

- SKILL.md — 2 KB

## SKILL.md

Reproducido tal cual desde millionco/react-doctor bajo NOASSERTION. Esta sección es el documento original y está en inglés.

# Write a rule

Implement the `rule-research` contract. If none exists, define a compact contract before editing.

## Plan the detector

State the diagnostic condition, required syntax and bindings, unsupported cases, and adversarial tests. Keep this plan short when the user already requested implementation.

Before adding a helper, search for one to reuse:

```sh
bunx @rayhanadev/truffler "<symbol-or-behavior>" \
  packages/oxlint-plugin-react-doctor/src/plugin \
  --kind function,interface,type,constant --limit 20
```

Read `docs/HOW_TO_WRITE_A_RULE.md`, nearby rules, utilities, and tests.

## Implement and test

1. Write detector pseudocode.
2. Add adversarial valid and invalid tests.
3. Implement only the contract's supported behavior.
4. Reuse utilities before creating new ones.
5. Update generated registration with repository commands.
6. Run focused tests and package checks.
7. Use `rde-eval` when real-code feedback could expose noise.
8. Hand the finished change to `rule-validate`.

Account for:

- import aliases and shadowed bindings
- nested functions that do not execute immediately
- transparent JavaScript and TypeScript wrappers
- dynamic computed properties
- imported or unresolved values
- framework escape hatches
- control-flow paths required by the diagnostic claim
- regressions found by reviews or evals

Keep uncertain cases quiet. Match the message to the condition the detector proves.

## Run repository checks

Use `@antfu/ni` commands:

```sh
nr test
nr lint
nr typecheck
nr format
nr smoke:json-report
```

Use focused commands while iterating. Record each command that ran.

## Report the implementation

Report changed rules, tests, registration, reused or added utilities, reported behavior, intentional non-goals, and validation results. End with the `rule-validate` handoff.

## Dónde encaja

- Categoría: [Herramientas para desarrolladores](https://skillsagentes.com/categorias/herramientas-desarrollo.md) — Skills que cambian cómo tu agente escribe, revisa y despliega código.
- Creador: [millionco](https://skillsagentes.com/creators/millionco.md) — 16 skills en el directorio
- [Todas las skills](https://skillsagentes.com/skills.md)
- [Ranking de instalaciones](https://skillsagentes.com/ranking.md)

## Otras skills del mismo repositorio

- [React Doctor](https://skillsagentes.com/skills/millionco/react-doctor/react-doctor.md): Escanea bases de código React en busca de problemas de seguridad, rendimiento, corrección y arquitectura, y da una puntuación de salud de 0 a 100. Incluye chequeo de regresión y un flujo completo de triage local con `/doctor`.
- [Run Parity](https://skillsagentes.com/skills/millionco/react-doctor/run-parity.md): Compara los diagnósticos de React Doctor de un pull request contra su base con Daytona. Se usa para correr parity, comprobar regresiones de diagnósticos en un PR o reportar diagnósticos añadidos y quitados.
- [Improve Threejs](https://skillsagentes.com/skills/millionco/react-doctor/improve-threejs.md): Audita y arregla apps de Three.js y React Three Fiber: rendimiento del frame-loop, fugas de memoria de GPU, corrección del grafo de escena y defectos visuales como z-fighting, shadow acne, espacio de color erróneo y resize roto.
- [Fuzz](https://skillsagentes.com/skills/millionco/react-doctor/fuzz.md): Somete a fuzzing las reglas de React Doctor con `@react-doctor/fuzz` para hallar crashes, lentitud, falsos positivos y diagnósticos sensibles a mutaciones. Se usa tras pasar los tests de la regla o al confirmarse un falso positivo nuevo.
- [Performance](https://skillsagentes.com/skills/millionco/react-doctor/performance.md): Diagnostica el rendimiento de React en tiempo de ejecución con trazas de React Doctor, marcado de renders en vivo, Long Animation Frames y evidencia de renders por componente. Se invoca como `/performance`.

## Skills relacionadas

- [Improve React](https://skillsagentes.com/skills/millionco/react-doctor/improve-react.md): Audita toda una base de código React como ingeniero sénior, apoyándose en el escaneo de React Doctor, y produce hallazgos priorizados y planes de implementación autocontenidos. Es de solo lectura: planifica mejoras, no las aplica.
- [Rule Research](https://skillsagentes.com/skills/millionco/react-doctor/rule-research.md): Define un contrato preciso de regla de React Doctor antes de implementarla. Se usa al validar la idea de una regla, recoger evidencia, identificar trampas de falso positivo o fijar los límites de la primera versión.
- [Fuzz](https://skillsagentes.com/skills/millionco/react-doctor/fuzz.md): Somete a fuzzing las reglas de React Doctor con `@react-doctor/fuzz` para hallar crashes, lentitud, falsos positivos y diagnósticos sensibles a mutaciones. Se usa tras pasar los tests de la regla o al confirmarse un falso positivo nuevo.
- [Domain Modeling](https://skillsagentes.com/skills/mattpocock/skills/domain-modeling.md): Construye y afila el modelo de dominio de un proyecto. Úsalo para fijar la terminología o un lenguaje ubicuo, registrar una decisión arquitectónica, o cuando otro skill necesita mantener el modelo.
- [Setup Pre Commit](https://skillsagentes.com/skills/mattpocock/skills/setup-pre-commit.md): Configura hooks de pre-commit con Husky y lint-staged (Prettier), typecheck y tests en el repo actual. Úsalo para añadir hooks de pre-commit, configurar Husky o lint-staged.

---

Skills Agentes · [Índice de páginas en markdown](https://skillsagentes.com/sitemap.md) · [Inicio](https://skillsagentes.com/index.md)