GraphQL Code Generator plugin for bare Apollo client operations with full type-safety.
With support for all: query
, mutation
and subscription
🎉
Made for @apollo/client v3
npm i codegen-apollo-bare-client
# or
yarn add codegen-apollo-bare-client
Install these if you don't already have them
@graphql-codegen/cli
@graphql-codegen/typescript
@graphql-codegen/typescript-operations
Inside your codegen.yaml
, for example:
schema: schema.gql
documents: src/graphql/*.gql
generates:
src/graphql/index.ts:
plugins:
- typescript
- typescript-operations
- codegen-apollo-bare-client
config:
# REQUIRED
apolloClientImport: 'import { client } from "../apolloClient"'
# "apolloClientName" is optional, by default looks for "client"
# Just make sure it's the same name as in the import
apolloClientName: client
# Optional prettier usage
hooks:
afterAllFileWrite:
- prettier --write src/graphql/*
And if you have for example:
query posts($limit: Int!) {
posts(limit: $limit) {
title
body
}
}
Reusing the typescript
and typescript-operations
generated code, it will generate functions like these:
export const postsClientQuery = (
opts: Omit<QueryOptions<PostsQueryVariables>, "query"> & {
variables: PostsQueryVariables;
}
) => {
return client.query<PostsQuery, PostsQueryVariables>({
query: PostsDocument,
...opts,
});
};