Graphql-code-generator: How to use both near-operation-file-preset and import-types-preset with typescript and react

Created on 10 Jan 2020  路  4Comments  路  Source: dotansimha/graphql-code-generator

I want to generate typing declear once in single file and other files just import its type from it when i start working with react,typescript and graphql

Although near-operation-file-preset generates a file per each operation file,every file repeats typing declear. And import-types-preset helps import types from file but it can not generate files like near-operation-file-preset .
One more thing is that near-operation-file-preset contains both types and components ,while splited to single file may be better i think.

What I want may look like this:

graphql
|--test1.graphql  // query and mutations
|--test1.generated.tsx  // components and hooks without types
|--test2.graphql  
|--test2.generated.tsx
|--types.ts   // types

But I find it's hard to work with both.

overwrite: true
schema: './schema.graphql'
documents: 'src/**/*.graphql'
generates:
  src/graphql/types.tsx:
    - typescript
  src/graphql/:
    preset:
      # near-operation-file
      import-types
    presetConfig:
      # extension: .generated.tsx
      # baseTypesPath: types.ts
      typesPath: types.ts
    plugins:
      - time:
        format: DD.MM.YY
        message: 'The file generated in: '
      - typescript
      - typescript-operations
      - typescript-react-apollo
    config:
      withHOC: true
      withHooks: true
      skipTypename: true

Does anyone can help me ?
Thanks a lot!

enhancement presets

Most helpful comment

I was exploring this as well, it turns out if you have the typescript plugin it generates a lot of unnecessary duplicates. I just removed the typescript plugin as it's not needed, and it removed over 5k lines of duplicated types, instead importing them from the shared types file, without having to use the import-types preset.

All 4 comments

This use case is not supported yet. PRs are welcome!

This use case is not supported yet. PRs are welcome!

sad to hear that especially a rookie like me.
thanks a lot anyway.

I was exploring this as well, it turns out if you have the typescript plugin it generates a lot of unnecessary duplicates. I just removed the typescript plugin as it's not needed, and it removed over 5k lines of duplicated types, instead importing them from the shared types file, without having to use the import-types preset.

@karl-run yeah because typescript generates the base types. It should be generated once into a single file. Then, each operation file should point to that file in order to load the base types from it, and choose the fields that it needs from it.

Was this page helpful?
0 / 5 - 0 ratings