A webpack plugin for GraphQL Code Generator.

• No abstraction over GraphQL Code Generator—you have full control over the technology without an extra API layer to maintain.
• Executes graphql-codegen internally in the right stages of a webpack build. This keeps your generated definitions up-to-date while developing, as you don't have to run an extra command to generate them anymore.
• Utilizes GraphQL Code Generator's Node.js API instead of relying on child processes.

npm install graphql-codegen-webpack-plugin --save-dev # or yarn add graphql-codegen-webpack-plugin --dev

Create a configuration file for GraphQL Code Generator:

# graphql-codegen.yml schema: 'path/to/schema/**/*.gql' documents: 'path/to/documents/**/*.tsx' generates: schema.ts: plugins: - typescript

Learn more about how to configure GraphQL Code Generator.

Finally, add the GraphQLCodegenWebpackPlugin plugin to your webpack configuration:

// webpack.config.js const { GraphQLCodegenWebpackPlugin, } = require('graphql-codegen-webpack-plugin') module.exports = { plugins: [ new GraphQLCodegenWebpackPlugin({ configPath: './graphql-codegen.yml', }), ], }

• graphql-let