PluginsTypeScriptstencil-apollo

TypeScript Stencil Apollo

Package nameWeekly DownloadsVersionLicenseUpdated
@graphql-codegen/typescript-stencil-apolloDownloadsVersionLicenseApr 19th, 2026

Installation

npm i -D @graphql-codegen/typescript-stencil-apollo
⚠️

Usage Requirements In order to use this GraphQL Codegen plugin, please make sure that you have GraphQL operations (query / mutation / subscription and fragment) set as documents: … in your codegen.yml.

Without loading your GraphQL operations (query, mutation, subscription and fragment), you won’t see any change in the generated output.

This plugin generates Stencil Apollo functional components typings

It extends the basic TypeScript plugins: @graphql-codegen/typescript, @graphql-codegen/typescript-operations - and thus shares a similar configuration.

Config API Reference

componentType

type: StencilComponentType default: functional

Customize the output of the plugin - you can choose to generate a Component class or a function component.

Usage Example

For the given input:

query Test {
  feed {
    id
    commentCount
    repository {
      full_name
      html_url
      owner {
        avatar_url
      }
    }
  }
}

We can use the generated code like this:

<TestComponent variables={...}>

</TestComponent>