Evita las dependencias circulares con SDP

Las dependencias circulares son asesinos silenciosos. No causan errores de compilación. No causan excepciones en tiempo de ejecución al importar. En su lugar, provocan valores undefined sutiles que aparecen en producción semanas después.

Un ciclo ocurre cuando el Módulo A importa de B, y B importa de vuelta de A.

JavaScript resuelve estas importaciones de forma silenciosa. Si el Módulo A aún se está cargando cuando el Módulo B lo solicita, JavaScript devuelve un objeto vacío. Tu código falla más tarde y el stack trace apunta al lugar equivocado.

Puedes solucionar esto con dependency-cruiser. Esta herramienta escanea tus archivos y mapea tu grafo de dependencias. Funciona con TypeScript y monorepos.

Cómo configurarlo:

  • Añádelo a tus dependencias de desarrollo: yarn add -D dependency-cruiser
  • Añade un script a tu package.json: "depcruise": "depcruise packages --config .dependency-cruiser.js"
  • Crea un archivo .dependency-cruiser.js para detectar ciclos.

Pero encontrar un ciclo es solo la mitad de la batalla. Debes evitar que se formen.

Utiliza el Principio de Dependencias Estables (SDP). Esta regla dice que debes depender en la dirección de la estabilidad.

La estabilidad es una propiedad estructural. Un módulo es estable cuando muchos otros módulos dependen de él. Si cambias un módulo estable, afectas a muchas personas. Este coste es lo que lo hace estable.

Utiliza la fórmula de inestabilidad: I = Fan-Out / (Fan-In + Fan-Out)

• I = 0 significa que un módulo es máximamente estable. Todo depende de él y él no depende de nada. • I = 1 significa que un módulo es máximamente inestable. Depende de muchas cosas y nada depende de él.

La regla: La puntuación de inestabilidad de un módulo debe ser mayor que la puntuación de cada módulo que importa. Tus flechas deben apuntar hacia una menor inestabilidad.

Tus utils de bajo nivel (I ≈ 0) nunca deberían importar de tus pages de alto nivel (I ≈ 1).

Puedes convertir este principio en una regla automatizada con dependency-cruiser. En lugar de solo buscar ciclos, verifica la dirección:

  • Evita que los utils importen de las features.
  • Evita que las features importen de las pages.

Esto detiene las condiciones estructurales que crean ciclos. Dejas de reaccionar a los errores y empiezas a prevenirlos.

Fuente: https://dev.to/wojciech_kot_b82f5d7cbfc6/stop-circular-dependencies-before-they-stop-you-dependency-cruiser-the-stable-dependencies-34ho