gatsby-plugin-generate-types
Experimental gatsby plugin that generate typescript types for pages / templates with graphql data. Designed to work well for VSCode users without actually making your project typescript.
It works by generating a schema.json
with the method from gatsby-plugin-extract-schema
. It then runs apollo codegen insidegatsby develop
/gatsby build
.
How to use
Install
yarn add gatsby-plugin-generate-types
gatsby-config.js
Edit moduleexports = plugins: "gatsby-plugin-generate-types";
or, if you want to generate types as part of productio builds
moduleexports = plugins: resolve: "gatsby-plugin-generate-types" options: inProduction: true ;
Add type imports
Type files will be generated in a _types
folder relative to your source files.
The package includes a helper page Type which takes the imported graphql type as an argument. You can use it in javascript files for function page / template components by adding just one line like this:
/** @type {import("gatsby-plugin-generate-types").page<import("./_types/IndexQuery").IndexQuery>} */const IndexPage = { //...}; const pageQuery = graphql` query IndexQuery { ... }`;
Use Apollo VSCode
The apollo VSCode extension, combined with this plugin (or just gatsby-plugin-extract-schema
) can provide validation and autocomplete for all your page and static queries.
Install the extension from the Marketplace and add the following apollo.config.js
to your project:
moduleexports = client: tagName: "graphql" service: name: "your-gatsby-site" localSchemaFile: "./schema.json" ;
gitignore generated files
It's a matter of taste wether you want to commit the generated types and schema to git or not. If you don't, add this to your .gitignore
schema.json_types
Roadmap
- generate directly usable page component types
- maybe: add type annotations directly to files
- don't run apollo codegen as shell command but use apollo-codegen-typescript package and maybe rely on gatsby watching
Changelog
1.0
- skip running in production build by default, unless
inProduction
option is specified
0.01
HI