I load my GraphQL schema like:
const schema = loadSchemaSync('./src/graphql/server/schema/*.gql', {
loaders: [new GraphQLFileLoader()],
})
This works fine locally, however, when deploying to vercel I get the error:
Unable to find any GraphQL type definitions for the following pointers:
- ./src/graphql/server/schema/*.gql
I think this is because vercel is dropping the relevant files after build?
The problem is that you cannot use dynamic loaders in Vercel Serverless Functions.
A workaround for this problem is to use a inline GraphQL schema.
// src/graphql/schema.ts
import { gql } from "apollo-server-core";
export default gql`
type Query {
greet: String!
}
`;
// src/pages/api/graphql.ts
import { ApolloServerPluginLandingPageGraphQLPlayground } from "apollo-server-core";
import Schema from "../../graphql/schema";
const apolloServer = new ApolloServer({
typeDefs: Schema,
resolvers,
plugins: [ApolloServerPluginLandingPageGraphQLPlayground],
introspection: true,
});
If you are using tools like codegen:
// codegen.ts
import { CodegenConfig } from "#graphql-codegen/cli";
const config: CodegenConfig = {
schema: "src/graphql/schema.ts",
documents: ["./src/**/*.{ts,tsx}"],
ignoreNoDocuments: true,
generates: {
"src/graphql/types/server.ts": {
plugins: [
"#graphql-codegen/typescript",
"#graphql-codegen/typescript-resolvers",
],
},
"src/graphql/types/client/": {
preset: "client",
plugins: [],
},
},
};
export default config;
Related
I'm trying to figure out what I need to do in order to have lib/graphql recognise the mutations I have made.
I have an issue.tsx (which is a form). It imports:
import {
IssueInput,
useUpdateIssueMutation,
useAllIssuesQuery,
useCreateIssueMutation,
useDeleteIssueMutation,
Issue as IssueGQLType,
} from "lib/graphql"
Other than IssueInput and Issue, I'm getting errors in my terminal that say these queries and mutations are not exported members.
However when I try to load the issue page in local host, I get an error that says:
error - GraphQLError [Object]: Syntax Error: Expected Name, found
. It points to the line where Issue is imported.
I made all of these queries and mutations in my resolver as follows:
import { Arg, Mutation, Query, Resolver } from "type-graphql"
import { Issue } from "./issue.model"
import { IssueService } from "./issue.service"
import { IssueInput } from "./inputs/create.input"
import { Inject, Service } from "typedi"
import { UseAuth } from "../shared/middleware/UseAuth"
import { Role } from "#generated"
#Service()
#Resolver(() => Issue)
export default class IssueResolver {
#Inject(() => IssueService)
issueService: IssueService
#Query(() => [Issue])
async allIssues() {
return await this.issueService.getAllIssues()
}
#Query(() => [Issue])
async futureRiskIssues() {
return await this.issueService.getFutureRiskIssues()
}
#Query(() => Issue)
async issue(#Arg("id") id: string) {
return await this.issueService.getIssue(id)
}
#UseAuth([Role.ADMIN])
#Mutation(() => Issue)
async createIssue(#Arg("data") data: IssueInput) {
return await this.issueService.createIssue(data)
}
#UseAuth([Role.ADMIN])
#Mutation(() => Issue)
async deleteIssue(#Arg("id") id: string) {
return await this.issueService.deleteIssue(id)
}
#UseAuth([Role.ADMIN])
#Mutation(() => Issue)
async updateIssue(#Arg("id") id: string, #Arg("data") data: IssueInput) {
return await this.issueService.updateIssue(id, data)
}
}
I can also see from my graphql.tsx file, that these functions are recognised as follows:
export type Mutation = {
__typename?: 'Mutation';
createIssue: Issue;
createUser: User;
deleteIssue: Issue;
destroyAccount: Scalars['Boolean'];
forgotPassword: Scalars['Boolean'];
getBulkSignedS3UrlForPut?: Maybe<Array<SignedResponse>>;
getSignedS3UrlForPut?: Maybe<SignedResponse>;
login: AuthResponse;
register: AuthResponse;
resetPassword: Scalars['Boolean'];
updateIssue: Issue;
updateMe: User;
};
export type MutationCreateUserArgs = {
data: UserCreateInput;
};
export type MutationDeleteIssueArgs = {
id: Scalars['String'];
};
export type MutationUpdateIssueArgs = {
data: IssueInput;
id: Scalars['String'];
};
I have run the codegen several times and can't think of anything else to try to force these mutations and queries to be recognised. Can anyone see a way to trouble shoot this?
My codegen.yml has:
schema: http://localhost:5555/graphql
documents:
- "src/components/**/*.{ts,tsx}"
- "src/lib/**/*.{ts,tsx}"
- "src/pages/**/*.{ts,tsx}"
overwrite: true
generates:
src/lib/graphql.tsx:
config:
withMutationFn: false
addDocBlocks: false
scalars:
DateTime: string
plugins:
- add:
content: "/* eslint-disable */"
- typescript
- typescript-operations
- typescript-react-apollo
When I look at the mutations available on the authentication objects (that are provided with the [boilerplate app][1] that I am trying to use), I can see that there are mutations and queries that are differently represented in the lib/graphql file. I just can't figure out how to force the ones I write to be included in this way:
export function useLoginMutation(baseOptions?: Apollo.MutationHookOptions<LoginMutation, LoginMutationVariables>) {
const options = {...defaultOptions, ...baseOptions}
return Apollo.useMutation<LoginMutation, LoginMutationVariables>(LoginDocument, options);
}
Instead, I get all of these things, but none of them look like the above and I can't figure out which one to import into my front end form so that I can make an entry in the database. None of them look like the queries or mutations I defined in my resolver
export type IssueInput = {
description: Scalars['String'];
issueGroup: Scalars['String'];
title: Scalars['String'];
};
export type IssueListRelationFilter = {
every?: InputMaybe<IssueWhereInput>;
none?: InputMaybe<IssueWhereInput>;
some?: InputMaybe<IssueWhereInput>;
};
export type IssueRelationFilter = {
is?: InputMaybe<IssueWhereInput>;
isNot?: InputMaybe<IssueWhereInput>;
};
export type IssueWhereInput = {
AND?: InputMaybe<Array<IssueWhereInput>>;
NOT?: InputMaybe<Array<IssueWhereInput>>;
OR?: InputMaybe<Array<IssueWhereInput>>;
createdAt?: InputMaybe<DateTimeFilter>;
description?: InputMaybe<StringFilter>;
id?: InputMaybe<UuidFilter>;
issueGroup?: InputMaybe<IssueGroupRelationFilter>;
issueGroupId?: InputMaybe<UuidFilter>;
subscribers?: InputMaybe<UserIssueListRelationFilter>;
title?: InputMaybe<StringFilter>;
updatedAt?: InputMaybe<DateTimeFilter>;
};
export type IssueWhereUniqueInput = {
id?: InputMaybe<Scalars['String']>;
};
I do have this record in my graphql.tsx file:
export type Mutation = {
__typename?: 'Mutation';
createIssue: Issue;
createIssueGroup: IssueGroup;
createUser: User;
deleteIssue: Issue;
deleteIssueGroup: IssueGroup;
destroyAccount: Scalars['Boolean'];
forgotPassword: Scalars['Boolean'];
getBulkSignedS3UrlForPut?: Maybe<Array<SignedResponse>>;
getSignedS3UrlForPut?: Maybe<SignedResponse>;
login: AuthResponse;
register: AuthResponse;
resetPassword: Scalars['Boolean'];
updateIssue: Issue;
updateIssueGroup: IssueGroup;
updateMe: User;
};
but I can't say: createIssueMutation as an import in my issue.tsx where I'm trying to make a form to use to post to the database.
[1]: https://github.com/NoQuarterTeam/boilerplate
In the issue form, I get an error that says:
"resource": "/.../src/pages/issue.tsx", "owner": "typescript",
"code": "2305", "severity": 8, "message": "Module '"lib/graphql"'
has no exported member 'useCreateIssueMutation'.", "source": "ts",
"startLineNumber": 7, "startColumn": 27, "endLineNumber": 7,
"endColumn": 54 }]
and the same thing for the query
check your codegen.yml
overwrite: true
schema: "http://localhost:4000/graphql"
documents: "src/graphql/**/*.graphql"
generates:
src/generated/graphql.tsx:
plugins:
- "typescript"
- "typescript-operations"
- "typescript-react-apollo"
./graphql.schema.json:
plugins:
- "introspection"
or try something like #Resolver(Issue)
It seems like you are not generating the hooks that you are trying to import.
You can update your codegen.yml file to add the generated hooks:
schema: http://localhost:5555/graphql
documents:
- "src/components/**/*.{ts,tsx}"
- "src/lib/**/*.{ts,tsx}"
- "src/pages/**/*.{ts,tsx}"
overwrite: true
generates:
src/lib/graphql.tsx:
config:
withMutationFn: false
addDocBlocks: false
scalars:
DateTime: string
withHooks: true # <--------------------- this line
plugins:
- add:
content: "/* eslint-disable */"
- typescript
- typescript-operations
- typescript-react-apollo
Nestjs application does not display the error message during development only during production. I found no module where the apollo -server can be configured to cache: "bounded". The Nestjs documentation itself makes no mention of it anywhere.
The complete error message says:
Persisted queries are enabled and are using an unbounded cache. Your server is vulnerable to denial of service attacks via memory exhaustion. Set cache: "bounded" or persistedQueries: false in your ApolloServer constructor, or see https://go.apollo.dev/s/cache-backends for other alternatives.
Here are some dependencies I suspect could be related to it.
"#nestjs/apollo": "10.0.19",
"#nestjs/common": "9.0.5",
"#nestjs/core": "9.0.5",
"#nestjs/graphql": "10.0.20",
A similar issue was opened at github and sadly it was closed without any solution.
This is related to the Apollo module's configuration, by default the cache is "unbounded" and not safe for production (see : https://www.apollographql.com/docs/apollo-server/performance/cache-backends/#ensuring-a-bounded-cache)
You can easily follow their recommendation by adding the optional "cache" configuration inside your GraphQL module.
GraphQLModule.forRoot<ApolloDriverConfig>({
driver: ApolloDriver,
cache: 'bounded', // <--- This option
...
}
Or provide an external caching with KeyvAdapter see: https://github.com/apollographql/apollo-utils/tree/main/packages/keyvAdapter#keyvadapter-class
In the app.module.ts inside the import array,
GraphQLModule.forRootAsync<ApolloDriverConfig>({
driver: ApolloDriver,
useClass: GqlConfigService,
}),
Then in the GqlConfigService I add cache: 'bounded' in the ApolloDriverConfig options.
import { ConfigService } from '#nestjs/config';
import { ApolloDriverConfig } from '#nestjs/apollo';
import { Injectable } from '#nestjs/common';
import { GqlOptionsFactory } from '#nestjs/graphql';
import { GraphqlConfig } from './config.interface';
#Injectable()
export class GqlConfigService implements GqlOptionsFactory {
constructor(private configService: ConfigService) {}
createGqlOptions(): ApolloDriverConfig {
const graphqlConfig = this.configService.get<GraphqlConfig>('graphql');
return {
// schema options
cache: 'bounded', // ! <== Added here
autoSchemaFile: graphqlConfig.schemaDestination || './src/schema.graphql',
sortSchema: graphqlConfig.sortSchema,
buildSchemaOptions: {
numberScalarMode: 'integer',
},
// subscription
installSubscriptionHandlers: true,
debug: graphqlConfig.debug,
playground: graphqlConfig.playgroundEnabled,
context: ({ req }) => ({ req }),
};
}
}
My project has 2 seperate connection datasources. One is to a readonly mysql database, the other is a postgres database.
Everything on the mysql database works fine. But I'm having issues with the postgres database.
Whenever I run the createQueryBuilder to getMany I get the following error.
EntityMetadataNotFoundError: No metadata for \"Score\" was found.
In my index.ts file where I spin up my server, I initialize the postgres db datasouce
pgDataSource.initialize();
And here is pgDataSource
import 'reflect-metadata';
import 'dotenv-safe/config';
import { DataSource } from 'typeorm';
import path from 'path';
import Score from '../entities/Score';
const pgDataSource = new DataSource({
name: 'favourites',
type: 'postgres',
url: process.env.DATABASE_URL,
logging: true,
synchronize: true,
migrations: [path.join(__dirname, './migrations/*')],
entities: [Score],
});
export const Manager = pgDataSource.manager;
export const ScoreRepository = pgDataSource.getRepository(Score);
export default pgDataSource;
At this point, everything seems fine, it creates a table in my database with the Score entity, so the connection exists and it acknowledges that there is an Entity as it creates the corresponding table.
Here is my Score entity
import { ObjectType, Field, Int } from 'type-graphql';
import { Entity, PrimaryGeneratedColumn, Column, BaseEntity } from 'typeorm';
#ObjectType()
#Entity({ database: 'pp_favourites', name: 'score' })
class Score extends BaseEntity {
#Field()
#PrimaryGeneratedColumn()
id!: number;
#Field(() => Int)
#Column()
propertyId!: number;
}
export default Score;
I have a GraphQL resolver for the mysql database and a resolver for postgres database.
However, when I run this query
await ScoreRepository.createQueryBuilder().getMany()
In a Query decorator function, I get the No metadata for \"Score\" was found. error
Although, if I run it through a useMiddleware decorator, it strangely works?
This is what my mysql resolver looks like with the query on the ScoreRespository
import { Resolver, Query } from 'type-graphql';
import Shortlist from '../entities/Shortlist';
import { ShortlistRepository } from '../datasources/ppDataSource';
import Property from '../entities/Property';
import { ScoreRepository } from '../datasources/pgDataSource';
#Resolver(Shortlist)
class ShortlistResolver {
#Query(() => [Property], { nullable: true })
async getShortlist(): Promise<Property[]> {
await ScoreRepository.createQueryBuilder().getMany()
}
}
export default ShortlistResolver;
Perhaps, also worth mentioning, as this could potentially be the issue. But in my index file where i spin up my server. I setup my ApolloServer which uses the now deprecated getConnectionfunction from typeorm
const apolloServer = new ApolloServer({
schema: await buildSchema({
resolvers: [ShortlistResolver, ScoreResolver],
validate: true,
}),
context: ({ req, res }) => ({
req,
res,
}),
plugins: [
// dataloaders with TypeormLoader in type-graphql-dataloader
ApolloServerLoaderPlugin({
typeormGetConnection: getConnection, // for use with TypeORM
}),
// use older playground
ApolloServerPluginLandingPageGraphQLPlayground({
settings: {
'request.credentials': 'include',
},
}),
],
});
I've tried
Adding #Resolver(Score) as a decorator to the ShortlistResolver
Removing the dist folder
creating a new database and new connection
Logged Manager.connection.entityMetadatas from pgDataSource which shows there are no entity's, despite being defined.
Any help would be greatly appreciated. I don't really know if the issue lies with TypeORM or GraphQL.
I'am trying to use the GraphQL federation with the schema first approach. Before I switch to federation, I was using ts-node and a little script to generate my typings like this :
import { GraphQLDefinitionsFactory } from '#nestjs/graphql';
import { join } from 'path';
const definitionsFactory = new GraphQLDefinitionsFactory();
definitionsFactory.generate({
typePaths: ['./src/**/*.graphql'],
path: join(process.cwd(), 'src/graphql.schema.ts'),
outputAs: 'class',
});
This was working well until I switch to the federation approach and modifying my schema adding the #Key() directive in my sites.graphql file (schema first!) :
type Site #key(fields: "siteId") {
siteId: ID!
contractId: Int
dateStart: String
siteName: String
}
type Query {
GetSite(id: ID!): Site
}
Now, when I generate my classes, I have the following error :
> ts-node src/tools/generate-typings.ts
(node:84388) UnhandledPromiseRejectionWarning: Error: Unknown directive "#key".
The #key directive does not seem to be recognized. Do I miss something?
Thank you for your help
Ok, digging in the source code of graphql-definitions.factory.ts I found an undocumented option federation.
Changing my script to :
import { GraphQLDefinitionsFactory } from '#nestjs/graphql';
import { join } from 'path';
const definitionsFactory = new GraphQLDefinitionsFactory();
definitionsFactory.generate({
typePaths: ['./src/**/*.graphql'],
path: join(process.cwd(), 'src/graphql.schema.ts'),
outputAs: 'class',
federation: true
});
And it works now.
Ps: to run the project, don't forget to eventually disable the installSubscriptionHandlers in the GraphQLModule options.
For federated subgraphs you should used GraphQLFederationDefinitionsFactory instead:
import { join } from 'path';
import { GraphQLFederationDefinitionsFactory } from '#nestjs/graphql';
const definitionsFactory = new GraphQLFederationDefinitionsFactory();
definitionsFactory.generate({
typePaths: ['./src/**/*.graphql'],
path: join(process.cwd(), 'src/graphql.ts'),
defaultScalarType: 'unknown',
customScalarTypeMapping: {
DateTime: 'Date',
},
watch: true,
});
I have created the script to generate the federation schema
import { writeFileSync, readFileSync } from 'fs';
import { buildSubgraphSchema } from '#apollo/subgraph';
import { printSchema, DocumentNode } from 'graphql';
import gql from 'graphql-tag';
async function generateSchema() {
// auto generate schema file
const subGraphschema = readFileSync('./src/schema/schema.graphql', {
encoding: 'utf8',
flag: 'r',
});
const schema: DocumentNode = gql(subGraphschema);
const generatedSchema = buildSubgraphSchema({
typeDefs: schema,
});
writeFileSync(
'./public/schema.graphql',
printSchema(generatedSchema),
'utf8',
);
console.log(`Generated GraphQL schema:\n\n${printSchema(generatedSchema)}`);
}
generateSchema();
I am trying to generate schema for my prisma data model while at the same time using secrets to restrict prisma access. After running prisma delete and prisma deploy, I run the command graphql get-schema -p prisma and get the following error message:
✖ prisma/prisma.yml could not be found.
Is there something wrong I am doing in my .graphqlconfig or how I am listing my prisma.yml? Thanks.
.graphqlconfig:
{
"projects": {
"prisma": {
"schemaPath": "generated/prisma.graphql",
"extensions": {
"prisma": "prisma/prisma.yml",
"endpoints": {
"default": "http://localhost:4466"
}
}
}
}
}
prisma/prisma.yml:
endpoint: http://localhost:4466
datamodel: datamodel.prisma
secret: 'secretFoo'
index.js:
import http from 'http';
import express from 'express';
import { ApolloServer } from 'apollo-server-express';
import resolvers from './resolvers';
import schema from './generated/prisma.graphql';
import { Prisma } from 'prisma-binding';
const prisma = new Prisma({
endpoint: 'http://localhost:4466',
secret: 'secretFoo',
typeDefs: 'server/generated/prisma.graphql',
});
const server = new ApolloServer({
context: {
prisma,
},
resolvers,
typeDefs: schema,
});
const app = express();
server.applyMiddleware({ app });
const PORT = 5000;
const httpServer = http.createServer(app);
server.installSubscriptionHandlers(httpServer);
httpServer.listen(PORT, () => {
console.log(`Server ready at http://localhost:${PORT}${server.graphqlPath}`);
console.log(`Subscriptions ready at ws://localhost:${PORT}${server.subscriptionsPath}`);
});
if (module.hot) {
module.hot.accept();
module.hot.dispose(() => server.stop());
}
You can generate a schema directly from your prisma.yml file, by adding the following to the file:
generate:
- generator: graphql-schema
output: ./generated/prisma.graphql
Then you can refer your .graphqlconfig to the generated file:
projects:
prisma:
schemaPath: generated/prisma.graphql
extensions:
endpoints:
dev: http://localhost:4466
You would generally restrict access to the management functionality of your endpoint through the Prisma docker-compose file (managementApiSecret in PRISMA_CONFIG). Then when you run commands like prisma deploy you would need to pass the appropriate environment variables through either the --env-file flag, or by having a dotenv file in the root of your application's directory (you also need the dotenv package installed in package.json.
Another way to secure your endpoint is to disable the GraphQL Playground altogether. I believe Apollo Server does this automatically when NODE_ENV is set to production, although you can do it explicitly with:
const server = new ApolloServer({
context: {
prisma,
},
resolvers,
typeDefs: schema,
playground: false, // <- Here
});
I'm sorry, I don't think this directly answered your question, but it may assist either way.