Graphql-code-generator: typescript-react-apollo & typescript-resolvers plugin collision

[yoavain-sundaysky]

Trying to generate both resolvers & react-apollo in the same config result in a file with error.
The following line appears twice:

export type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>;

To Reproduce
Steps to reproduce the behavior:

1. My GraphQL schema:
   test.graphql

schema {
    query: Query
    mutation: Mutation
}

type Query {
    _: Boolean
}
type Mutation {
    _: Boolean
}
type Test {
    id: ID!
    created: String!
    updated: String!
    name: String!
    description: String
}

extend type Query {
    tests: [Test]
    test(id: ID!): Test
}

1. My GraphQL operations:
   testQuery.graphql

query getTest($id: ID!) {
    test(id: $id) {
        id
        name
        description
    }
}

1. My codegen.yml config file:

overwrite: true
schema:
  - test.graphql
documents:
  - testQuery.graphql
generates:
  ./graphqlGeneratedTypes/graphql.tsx:
    config:
      typesPrefix: "Gql"
      namingConvention:
        typeNames: change-case#pascalCase
        enumValues: change-case#upperCase
      immutableTypes: true
    plugins:
      - typescript
      - typescript-operations
      - typescript-resolvers
      - typescript-react-apollo

Expected behavior
A valid typescript file

Environment:

• OS: Windows
• @graphql-codegen/...: 1.1.1
• NodeJS: 10.15.3

Additional context

[dotansimha]

Just to be sure - you are using both on the same output file because you implement GraphQL schema on the client side, right?

[yoavain-sundaysky]

I have a project with both the server and client, and I tried to generate all types to the same output file.
I guess this isn't such a common use case, as most project will have the server and client separated.
I guess I could create 2 separate output files, one for the server, and one for the client.

[dotansimha]

@yoavain-sundaysky Just separate it like that:

overwrite: true
schema: test.graphql
config:
   typesPrefix: "Gql"
      namingConvention:
        typeNames: change-case#pascalCase
        enumValues: change-case#upperCase
      immutableTypes: true
generates:
  ./client/graphql.tsx:
    documents: testQuery.graphql
    plugins:
      - typescript
      - typescript-operations
      - typescript-react-apollo
  ./server/graphql.ts:
    plugins:
      - typescript
      - typescript-resolvers

Because it's not a good idea to merge them, but you can use the codegen to generate more than one file at a time.

[totallymike]

I ran into this issue just now. I'm trying to generate types for a client-side resolver for some local state. It seems unnecessarily painful to generate a whole new file for this one task, when I would only need to generate the Scalars and such one time.

On a slightly unrelated note, I'd love to be able to restrict the resolvers to just the client-side ones.

[dotansimha]

@totallymike if you wish to get the resolvers only for the client-side types, you can use a separate file with it's own schema: section on the .yml config file.
But I do understand the collision in case you want to generate all in the same file. Keeping open until we'll resolve that.

[ardatan]

Imports should be handled in the visitor class using Set not in the subclasses like now in my opinion. So Omit will be added only once in this case. @dotansimha What do you think?

[dotansimha]

Hmm, it's not general I think, because plugins can't effect each other at the moment.
I think plugins should have a way to add things to the head of files with priority (it will solve the issue with Flow magic comment, the order of imports and this as well). But this is a complicated solution at the moment.
I think the 4th argument of the plugin method now exposes the entire plugins section from the config, so we can make sure to add it only once if there are other plugins that might add the same util type.

[minheq]

I would also want to add that I would like to combine client and server types because

• I would like to avoid having conflicts with code autocompletion that VS Code provides. (Intellisense will list same type from both files)
• I would like to export the types from client and server code, from a package.

export * from './GeneratedCode'
// instead of
export * from './ClientGeneratedCode'
export * from './ServerGeneratedCode' // Type collision

From what I understand, the recommended approach is to generate both client vs server types

[dotansimha]

Fixed in: https://github.com/dotansimha/graphql-code-generator/pull/1869

[minheq]

Wow! This was incredibly fast! Thank you for the great work!

[dotansimha]

Fixed in 1.2.0.