typescript - Hoe een circulaire afhankelijkheid te vermijden in een Angular-project met Apollo-client en `graphql-codegen` bij het importeren van typen in client-resolver?

Mijn doel is om gegenereerde typen te gebruiken bij het schrijven van client-side resolvers met de Apollo-client.

Alles in de client-side resolvers werkt zoals hier door Apollo beschreven. In het project gebruiken we echter ook gegenereerde types en GQL-services zoals beschreven in deze blog. En hier komt het probleem. Als ik een type importeer uit de gegenereerde types in de client-side resolvers, krijg ik de fout:

WARNING in Circular dependency detected:
eddy.module.ts ->
  ...graphql.module.ts ->
  ...resolvers.ts ->
  ...client-specific-recommendation-resolver.ts ->
  ...get-top-right-corner-state.ts ->
  ...graphql.ts -> // (generated types)
  ...eddy.module.ts

Dus in wezen in het get-top-right-corner-state.ts bestand, omdat ik op deze manier uit de gegenereerde typen importeer:

import { Something } from '../../../../../generated/graphql';

Notities

Onze applicatie laadt Apollo in een module genaamd graphql.module, die wordt gebruikt door een feature-module genaamd "eddy". We hebben dit geconfigureerd met de ngModule-eigenschap in het codegen.yml-bestand.

Wat kan ik doen om dit te voorkomen? Ik zou heel graag de types gegenereerd door graphql-codegen willen gebruiken, ook in mijn client-side resolvers.

Antwoord #1

Na het lezen en experimenteren met dit probleem, heb ik een oplossing gevonden. De opzet is eigenlijk vrij eenvoudig, maar een beetje ingewikkelder dan alleen het aanbieden van de gegenereerde services in de root van Angular.

De feature-module doet de Apollo-configuratie en maakt de client-side resolvers aan. Maar in plaats van hier de gegenereerde services te leveren, worden ze geleverd in een andere module, hier lazy-loaded.module.ts genoemd. Het codegen.yml ziet er nu zo uit, en er zijn geen circulaire afhankelijkheden:

generates:
 <path-to-feature-module>/graphql.ts:
   schema: <path-to-client-schema>.ts
   documents: ./src/**/*.graphql
   config:
    ngModule: <path-to-lazy-loaded-module>#LazyLoadedModule

De lui geladen module wordt vervolgens geïmporteerd door de feature-module die Apollo levert, en voila, probleem opgelost 😇