dotansimha/graphql-code-generator

typescript-graphql-request & near-operation-file important improvement.

Open

#5,472 创建于 2021年1月30日

在 GitHub 查看
 (2 评论) (6 反应) (0 负责人)TypeScript (10,341 star) (1,295 fork)batch import
help wantedkind/enhancementplugins

描述

First of all thank you for these great tools! They are awesome and I use it for all my graphql projects!

So lets dive in to my issue/feature request Is your feature request related to a problem? Please describe.

I have this config ---

schema:
  - http://localhost:8080/v1/graphql
documents:
  - ./src/**/*.graphql
generates:
  ./src/__generated__/introspection-result.ts:
    plugins:
      - fragment-matcher
  ./src/__generated__/schema.graphql:
    plugins:
      - schema-ast
  ./src/__generated__/types.ts:
    plugins:
      - typescript
      # - typescript-graphql-request
    config:
      useIndexSignature: true
      scalars: ## TODO - add more scalars
        float8: number
  ./src/:
    preset: near-operation-file
    presetConfig:
      baseTypesPath: ./__generated__/types.generated
      extension: .generated.ts
    plugins:
      - typescript-operations
      - typescript-graphql-request

Using the typescript-graphql-requestplugin with the near-operation-file preset generates for each .graphql file a .ts file correctly with it's own SDK like so

File Struct:

// File Struct

src
-feature
--feature.graphql
# feature/feature.graphql

query MyQuery {
  Ingredients {
    id
    isNeedExpirationDate
  }
}

query AnotherQuery {
  Ingredients {
    id
    isNeedExpirationDate
    currentStock
  }
}

I will have this output File Struct:

// Output File Struct

src
-feature
--feature.graphql
--feature.generated.ts

and a generated file that will contain this:

//feature.generated.ts

export type SdkFunctionWrapper = <T>(action: () => Promise<T>) => Promise<T>;


const defaultWrapper: SdkFunctionWrapper = sdkFunction => sdkFunction();
export function getSdk(client: GraphQLClient, withWrapper: SdkFunctionWrapper = defaultWrapper) {
  return {
    MyQuery(variables?: MyQueryQueryVariables, requestHeaders?: HeadersInit): Promise<MyQueryQuery> {
      return withWrapper(() => client.request<MyQueryQuery>(print(MyQueryDocument), variables, requestHeaders));
    },
    AnotherQuery(variables?: AnotherQueryQueryVariables, requestHeaders?: HeadersInit): Promise<AnotherQueryQuery> {
      return withWrapper(() => client.request<AnotherQueryQuery>(print(AnotherQueryDocument), variables, requestHeaders));
    }
  };
}
export type Sdk = ReturnType<typeof getSdk>;

now to use it, I would do something like this:

// File that would use the feature sdk

import {getSdk: getFeatureSdk} from './feature.generated.ts';

The thing is, its frustrating having so many getSdk's when looking up an sdk to use, I mean when I would type, const x = getSdk, the autocomplete will suggest me with many getSdk's from many generated files.

Describe the solution you'd like I think it will be great to have the option to rename the getSdk(and the Sdk, SdkFunctionWrapper types) to getFeatureSdk, FeatureSdk, FeatureSdkFunctionWrapper when using near-file-operation preset. A config option for typescript-graphql-request that will add the operation name as a prefix.

Waiting for you response Thanks,

贡献者指南