typescript-operations, I want to use query result interface

[SmileJayden]

I want to use code in other script file, so I try to export that blue-roomed part. I try to find plugin config option which can export that blue part separately, but I cannot find.

Crying and eating mustard, I import this by export type Publication = Omit<GetPublicationQuery['publication'], '__typename'>; this way.

Is there any way to import/export that blue part directly from generated file?

thanks in advance!

Below is my codegen.yml

generates:
  lib/generated/graphql.ts:
    plugins:
      - 'typescript'
      - 'typescript-operations'
      - 'typescript-react-apollo'
    config:
      reactApolloVersion: 3
      avoidOptionals: true
      withHooks: false
      withHOC: false
      withComponent: false
      skipTypename: false
      exportFragmentSpreadSubTypes: true
      flattenGeneratedTypes: true
      documentMode: graphQLTag

[dotansimha]

Hi @SmileJayden ,

We had long discussion here about the differences. In the end, it's a matter of preference and what you are used to.

I can only recommend the following:

• Use more fragments. Fragments makes it easier to understand what fields you actually need per each type in your schema, and the codegen generates types for fragments, so it makes it easier to reuse. It's also easier to pass fragment type to component props.

• Create a file that does the following:

export * from './types.tsx';
import { MyQuery } from './types.tsx';

export const MyType = MyQuery['type'][number];

It will eliminate the amount of aliasing you have to do, and put them all in one place.

• Use typescript-compatibility plugin. In an older version of the codegen we had those intermediate types, but we decided to drop it. this plugin creates those and might simplify the migrate for you.

Also related:

• Typescript helper for drilling into nested types? #2832
• Add named sub/child types to query/mutation/subcription results #4241
• Generate types for each node or edge in the query as a separate interface #4390

[SmileJayden]

I hoped to use the result type separately, but I was persuaded by your words.

However, there is one more question mark. Why do you recommand fragments?

Do you mean gql fragment?
I don't think using gql fragment improves my hope that I want to use result type separately.

When I use fragment, What I get more in generated file is only gql document node. Which is below picture.

Thanks for your kind answer! 😁

[dotansimha]

That's the precompiled DocumentNode. Look for the TypeScript type. It should include the sub-types instead of creating inline types :)

[SmileJayden]

I tried much time, but there is no generated sub-types 😢
But a while back, I noticed that my codegen.yml's flattenGeneratedTypes option is set true, which was source of evil...! 👍
Finally I got sub-types! 🎉
Thanks for your kind answer 🤸‍♂️