dotansimha/graphql-code-generator-community

[typescript-react-apollo]: `importDocumentNodeExternallyFrom` omits `documentVariableSuffix`

Open

#141 opened on 2021年8月23日

GitHub で見る
 (3 comments) (0 reactions) (0 assignees)TypeScript (195 forks)github user discovery
help wanted

Repository metrics

Stars
 (136 stars)
PR merge metrics
 (PR metrics pending)

説明

I'm trying to figure out how to be able to generate separate files: one containing only types/operations/typed-document-nodes, and the other containing only react hooks. The goal is that then if a consuming package doesn't depend on react, it can specifically import the types and not have any errors since the react hooks are in a separate file, while minimizing the duplication of generated code/types.

(BTW, if there are better ways of doing this please let me know!)

For this, I am thinking of generating types/operations/typed-document-nodes in one file say types.ts, and then only react hooks in e.g. react.ts.

As a result, I need react.ts to import types and operations from types.ts to avoid duplicating types.

I can more or less approximate this by using:

documentMode: external
importDocumentNodeExternallyFrom: ./types

In the typescript-react-apollo config. However, this ends up referring to documents as e.g. Operations.SomeOperation instead of Operations.SomeOperationDocument which is how the document is named in types.ts. One workaround I can think of is setting documentVariableSuffix: "" in the configuration for types.ts, but this is not ideal as it's hacky and my code already references variables with the Document suffix.

I believe maybe the problem is because the seemingly-relevant code for typescript-react-apollo doesn't take into account any kind of suffix, such as this.config.documentVariableSuffix:

https://github.com/dotansimha/graphql-code-generator/blob/0538923f0cee884f95136b3ac794f83238cee568/packages/plugins/typescript/react-apollo/src/visitor.ts#L161-L165

I wonder if it should be something like Operations.${node.name?.value ?? ''}${this.config.documentVariableSuffix} instead?

コントリビューターガイド