@rollup/plugin-graphql

Convert .gql/.graphql files to ES6 modules

Usage no npm install needed!

<script type="module">
  import rollupPluginGraphql from 'https://cdn.skypack.dev/@rollup/plugin-graphql';
</script>

README

npm size libera manifesto

@rollup/plugin-graphql

🍣 A Rollup plugin which Converts .gql/.graphql(s) files to ES6 modules.

Requirements

This plugin requires an LTS Node version (v10.0.0+) and Rollup v1.20.0+.

Install

Using npm:

npm install @rollup/plugin-graphql --save-dev

Usage

Create a rollup.config.js configuration file and import the plugin:

import graphql from '@rollup/plugin-graphql';

export default {
  input: 'src/index.js',
  output: {
    dir: 'output',
    format: 'cjs'
  },
  plugins: [graphql()]
};

Then call rollup either via the CLI or the API.

With an accompanying file src/index.js, you can import GraphQL files or named queries/mutations:

// src/index.js

// import a GraphQL Document from a GraphQL file,
import schema from './schema.graphql';

// or import named Query/Mutation
import { BatmanQuery, JokerMutation } from './schema.graphql';

Fragments

Thanks to graphql-tag, fragments import is supported by using #import "...".

Given the following file heroFragment.graphql:

fragment HeroFragment on Hero {
  id
  name
}

You can import it like this:

#import "./heroFragment.graphql"

query AllHeroes {
  heros {
    ...HeroFragment
  }
}

Options

exclude

Type: String | Array[...String]
Default: null

A minimatch pattern, or array of patterns, which specifies the files in the build the plugin should ignore. By default no files are ignored.

include

Type: String | Array[...String]
Default: null

A minimatch pattern, or array of patterns, which specifies the files in the build the plugin should operate on. By default all files are targeted.

Meta

CONTRIBUTING

LICENSE (MIT)