Description
This plugin uses graphql-codegen to automatically generate typings for the gatsby graphql schema and your graphql queries.
How to install
using yarn: yarn add gatsby-plugin-generate-typings
in your gatsby-config.js add
{
// automatically generate typings from graphql schema
resolve: 'gatsby-plugin-generate-typings',
options: {
dest: './src/generated/graphql-types.d.ts',
},
},
to automatically generate ./src/generated/graphql-types.d.ts.
Available options
dest: the destination file name, where the typings will be written to.
When do I use this plugin?
When using gatsby-plugin-typescript it comes handy to have typings for your graphql schema and queries.
Examples of usage
When installed as above you can do
import { SiteTitleQueryQuery } from '../generated/graphql-types';
// ... somewhere in your render() function:
<StaticQuery
query={graphql`
query SiteTitleQuery {
site {
siteMetadata {
title
}
}
}
`}
render={(data: SiteTitleQueryQuery) => {
// can use data.site.siteMetadata and have full Typescript Typings for it
}}
/>