Installation
graphql-ppx
1. We rely on Graphql-ppx for typesafe GraphQL operations and fragments in ReasonML. Go to the official documentation for installation instructions.
You should now have a graphql_schema.json
in your project somewhere. Make sure it's always up-to-date!
2. Apollo Client
npm install rescript-apollo-client @apollo/client
graphql-ppx
Configuration
3. Apollo-Specific Add the following under bs-dependencies
and graphql
, in your bsconfig.json
{
"graphql": {
+ "apolloMode": true,
+ "extendMutation": "ApolloClient.GraphQL_PPX.ExtendMutation",
+ "extendQuery": "ApolloClient.GraphQL_PPX.ExtendQuery",
+ "extendSubscription": "ApolloClient.GraphQL_PPX.ExtendSubscription",
+ "templateTagReturnType": "ApolloClient.GraphQL_PPX.templateTagReturnType",
+ "templateTagImport": "gql",
+ "templateTagLocation": "@apollo/client"
},
"ppx-flags": ["@reasonml-community/graphql-ppx/ppx"],
"bs-dependencies: [
"@reasonml-community/graphql-ppx"
+ "rescript-apollo-client"
]
}
"apolloMode"
automaticaly sprinkles__typename
throughout our operation and fragment definitions"templateTag*"
is how we tellgraphql-ppx
to wrap every operation withgql
"extend*"
allowsrescript-apollo-client
to automatically decorate the generated modules with Apollo-specific things like the correct hook for that operation!
If you use a bundler that does not support require
statements (eg: esbuild
), you will need to add one more piece of configuration
{
"graphql": {
+ "templateTagIsFunction": true,
...
}
}
This is probably temporary, until ReScript supports template tags or has some way to output them.
See [this graphql-ppx issue](https://github.com/reasonml-community/rescript-apollo-client/issues/70)