我正在遵循Apollo Docs教程来使用TypeScript构建Apollo Server（Express），并且我还使用GraphQL代码生成器根据我的GraphQL模式生成必要的类型。
这是我当前的codegen.json配置：
{
"schema": "./lib/schema/index.graphql",
"generates": {
"./dist/typings/graphql/schema.d.ts": {
"plugins": [
"typescript",
"typescript-resolvers"
],
"config": {
"typesPrefix": "GQL",
"skipTypename": true,
"noSchemaStitching": true,
"useIndexSignature": true
}
}
}
}
这是基于教程的我当前的GraphQL模式（尚不完整，我还没有完成全部操作，因此我做了一些调整以使示例更小）：
type Query {
launch(id: ID!): Launch
}
type Launch {
id: ID!
site: String
mission: Mission
}
enum PatchSize {
SMALL
LARGE
}
type Mission {
name: String
missionPatch(mission: String, size: PatchSize): String
}
生成以下TypeScript类型：
import { GraphQLResolveInfo } from 'graphql';
export type Maybe<T> = T | null;
export type RequireFields<T, K extends keyof T> = { [X in Exclude<keyof T, K>]?: T[X] } & { [P in K]-?: NonNullable<T[P]> };
/** All built-in and custom scalars, mapped to their actual values */
export type Scalars = {
ID: string,
String: string,
Boolean: boolean,
Int: number,
Float: number,
};
export type GQLLaunch = {
id: Scalars['ID'],
site?: Maybe<Scalars['String']>,
mission?: Maybe<GQLMission>,
};
export type GQLMission = {
name?: Maybe<Scalars['String']>,
missionPatch?: Maybe<Scalars['String']>,
};
export type GQLMissionMissionPatchArgs = {
mission?: Maybe<Scalars['String']>,
size?: Maybe<GQLPatchSize>
};
export enum GQLPatchSize {
Small = 'SMALL',
Large = 'LARGE'
}
export type GQLQuery = {
launch?: Maybe<GQLLaunch>,
};
export type GQLQueryLaunchArgs = {
id: Scalars['ID']
};
export type WithIndex<TObject> = TObject & Record<string, any>;
export type ResolversObject<TObject> = WithIndex<TObject>;
export type ResolverTypeWrapper<T> = Promise<T> | T;
export type ResolverFn<TResult, TParent, TContext, TArgs> = (
parent: TParent,
args: TArgs,
context: TContext,
info: GraphQLResolveInfo
) => Promise<TResult> | TResult;
export type Resolver<TResult, TParent = {}, TContext = {}, TArgs = {}> = ResolverFn<TResult, TParent, TContext, TArgs>;
export type SubscriptionSubscribeFn<TResult, TParent, TContext, TArgs> = (
parent: TParent,
args: TArgs,
context: TContext,
info: GraphQLResolveInfo
) => AsyncIterator<TResult> | Promise<AsyncIterator<TResult>>;
export type SubscriptionResolveFn<TResult, TParent, TContext, TArgs> = (
parent: TParent,
args: TArgs,
context: TContext,
info: GraphQLResolveInfo
) => TResult | Promise<TResult>;
export interface SubscriptionSubscriberObject<TResult, TKey extends string, TParent, TContext, TArgs> {
subscribe: SubscriptionSubscribeFn<{ [key in TKey]: TResult }, TParent, TContext, TArgs>;
resolve?: SubscriptionResolveFn<TResult, { [key in TKey]: TResult }, TContext, TArgs>;
}
export interface SubscriptionResolverObject<TResult, TParent, TContext, TArgs> {
subscribe: SubscriptionSubscribeFn<any, TParent, TContext, TArgs>;
resolve: SubscriptionResolveFn<TResult, any, TContext, TArgs>;
}
export type SubscriptionObject<TResult, TKey extends string, TParent, TContext, TArgs> =
| SubscriptionSubscriberObject<TResult, TKey, TParent, TContext, TArgs>
| SubscriptionResolverObject<TResult, TParent, TContext, TArgs>;
export type SubscriptionResolver<TResult, TKey extends string, TParent = {}, TContext = {}, TArgs = {}> =
| ((...args: any[]) => SubscriptionObject<TResult, TKey, TParent, TContext, TArgs>)
| SubscriptionObject<TResult, TKey, TParent, TContext, TArgs>;
export type TypeResolveFn<TTypes, TParent = {}, TContext = {}> = (
parent: TParent,
context: TContext,
info: GraphQLResolveInfo
) => Maybe<TTypes>;
export type NextResolverFn<T> = () => Promise<T>;
export type DirectiveResolverFn<TResult = {}, TParent = {}, TContext = {}, TArgs = {}> = (
next: NextResolverFn<TResult>,
parent: TParent,
args: TArgs,
context: TContext,
info: GraphQLResolveInfo
) => TResult | Promise<TResult>;
/** Mapping between all available schema types and the resolvers types */
export type GQLResolversTypes = ResolversObject<{
Query: ResolverTypeWrapper<{}>,
ID: ResolverTypeWrapper<Scalars['ID']>,
Launch: ResolverTypeWrapper<GQLLaunch>,
String: ResolverTypeWrapper<Scalars['String']>,
Mission: ResolverTypeWrapper<GQLMission>,
PatchSize: GQLPatchSize,
Boolean: ResolverTypeWrapper<Scalars['Boolean']>,
}>;
/** Mapping between all available schema types and the resolvers parents */
export type GQLResolversParentTypes = ResolversObject<{
Query: {},
ID: Scalars['ID'],
Launch: GQLLaunch,
String: Scalars['String'],
Mission: GQLMission,
PatchSize: GQLPatchSize,
Boolean: Scalars['Boolean'],
}>;
export type GQLLaunchResolvers<ContextType = any, ParentType extends GQLResolversParentTypes['Launch'] = GQLResolversParentTypes['Launch']> = ResolversObject<{
id?: Resolver<GQLResolversTypes['ID'], ParentType, ContextType>,
site?: Resolver<Maybe<GQLResolversTypes['String']>, ParentType, ContextType>,
mission?: Resolver<Maybe<GQLResolversTypes['Mission']>, ParentType, ContextType>,
}>;
export type GQLMissionResolvers<ContextType = any, ParentType extends GQLResolversParentTypes['Mission'] = GQLResolversParentTypes['Mission']> = ResolversObject<{
name?: Resolver<Maybe<GQLResolversTypes['String']>, ParentType, ContextType>,
missionPatch?: Resolver<Maybe<GQLResolversTypes['String']>, ParentType, ContextType, GQLMissionMissionPatchArgs>,
}>;
export type GQLQueryResolvers<ContextType = any, ParentType extends GQLResolversParentTypes['Query'] = GQLResolversParentTypes['Query']> = ResolversObject<{
launch?: Resolver<Maybe<GQLResolversTypes['Launch']>, ParentType, ContextType, RequireFields<GQLQueryLaunchArgs, 'id'>>,
}>;
export type GQLResolvers<ContextType = any> = ResolversObject<{
Launch?: GQLLaunchResolvers<ContextType>,
Mission?: GQLMissionResolvers<ContextType>,
Query?: GQLQueryResolvers<ContextType>,
}>;
这是我的resolvers.ts文件：
import { GQLPatchSize } from '@typings/graphql/schema';
import { GQLResolvers } from '@typings/graphql/schema';
const resolvers: GQLResolvers = {
Query: {
launch: (_, args, { dataSources }) => {
return dataSources.launchesAPI.getLaunchById(args);
},
},
Mission: {
missionPatch: (mission, { size } = { size: GQLPatchSize.Large }) => {
return size === 'SMALL' ? mission.missionPatchSmall : mission.missionPatchLarge;
},
},
};
export { resolvers };
最后，我launches.ts的LaunchesAPI课程文件：
import { GQLLaunch } from '@typings/graphql/schema';
import { GQLQueryLaunchArgs } from '@typings/graphql/schema';
import { RESTDataSource } from 'apollo-datasource-rest';
const SPACEX_API_ENDPOINT = 'https://api.spacexdata.com/v3/';
class LaunchesAPI extends RESTDataSource {
constructor() {
super();
this.baseURL = SPACEX_API_ENDPOINT;
}
async getLaunchById({ id }: GQLQueryLaunchArgs) {
const response = await this.get('launches', { flight_number: id });
return this.launchReducer(response[0]);
}
launchReducer(launch: any): GQLLaunch {
return {
id: String(launch.flight_number) || '0',
site: launch.launch_site && launch.launch_site.site_name,
mission: {
name: launch.mission_name,
missionPatchSmall: launch.links.mission_patch_small,
missionPatchLarge: launch.links.mission_patch,
},
};
}
}
export { LaunchesAPI };
现在，因为我要输入launchReducer()with的结果GQLLaunch，所以mission属性类型为GQLMission并且此类型只有两个属性name和missionPatch。它没有missionPatchSmall或missionPatchLarge，因此出现此错误：
输入'{name：any; missionPatchSmall：任意；missionPatchLarge：任意；}”不可分配给“ GQLMission”类型。对象文字只能指定已知属性，并且'missionPatchSmall'在'GQLMission'类型中不存在。ts（2339）
resolvers.ts尝试读取文件时，文件中存在类似的错误，mission.missionPatchSmall或者类型mission.missionPatchLarge中的mission对象中不存在错误GQLMission：
类型“ GQLMission”上不存在属性“ missionPatchSmall”。ts（2339）
我不确定如何处理，建议？
你把对性能mission不在的一部分GQLMission，然后键入明确mission对GQLMission。一般而言，您试图从架构中生成类型，但是解析器的返回类型与架构所指定的类型不匹配。
在大多数情况下，您面临的挑战是由于架构设计中的某些缺陷或解析器实现中的某些黑手党造成的。
因此，您的选择通常是：
假设您打算使用解析器生成的模式生成的类型继续前进，我们可以消除选项1并考虑适用于您情况的最后三个选项。
GQLMission架构中的类型以匹配解析器的返回类型（包括missionPatchLarge和missionPatchSmall属性），并允许客户端直接通过其查询架构来查询一个或两个。missionPatchLarge和missionPatchSmall），您目前正在使用这些属性来简化实现，并missionPatch在子missionPatchResolver解析器中重新获取适当的值（最好是通过缓存来防止perf命中）。missionPatch在架构上的表示形式。考虑一下性质missionPatch。真的是非此即彼的情况吗？此解决方案将涉及更改大小为和的模式API的形状，missionPatch然后将其镜像到您的解析器实现中。您将做什么取决于a的性质missionPatch。我的猜测是最后三个选项之一在这里有意义。如果两个missionPatch类型实际上是不同的变体，它可能是有意义的改变missionPatch到missionPatches，它返回的数组MissionPatch的对象，其可以通过进行过滤size。如果一个是另一个的派生，则将它们分开放置missionPatch并missionPatchSmall通过架构公开字符串可能是最有意义的。
编辑：查看正在使用的api，很明显，这些是可以同时请求的独立值。没有小任务或大任务。这些是同一任务的不同大小的图像。我的方法可能是将这些值直接或在嵌套missionPatch属性中都包含在架构中，例如
export type GQLMission = {
name?: Maybe<Scalars['String']>,
smallPatchUrl: String,
largePatchUrl: String,
# OR
patch?: MissionPatch,
};
export type MissionPatch = {
smallUrl: String,
largeUrl: String
};
旁注：通过图像本身的值对象类型表示图像是很常见的，该对象类型可以包括不同尺寸图像的url以及图像的详细信息，例如长宽比或本机宽度或高度。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句