1 | [npm]: https://img.shields.io/npm/v/@rollup/plugin-graphql
|
2 | [npm-url]: https://www.npmjs.com/package/@rollup/plugin-graphql
|
3 | [size]: https://packagephobia.now.sh/badge?p=@rollup/plugin-graphql
|
4 | [size-url]: https://packagephobia.now.sh/result?p=@rollup/plugin-graphql
|
5 |
|
6 | [![npm][npm]][npm-url]
|
7 | [![size][size]][size-url]
|
8 | [![libera manifesto](https://img.shields.io/badge/libera-manifesto-lightgrey.svg)](https://liberamanifesto.com)
|
9 |
|
10 | # @rollup/plugin-graphql
|
11 |
|
12 | 🍣 A Rollup plugin which Converts .gql/.graphql(s) files to ES6 modules.
|
13 |
|
14 | ## Requirements
|
15 |
|
16 | This plugin requires an [LTS](https://github.com/nodejs/Release) Node version (v14.0.0+) and Rollup v1.20.0+.
|
17 |
|
18 | ## Install
|
19 |
|
20 | Using npm:
|
21 |
|
22 | ```console
|
23 | npm install @rollup/plugin-graphql --save-dev
|
24 | ```
|
25 |
|
26 | ## Usage
|
27 |
|
28 | Create a `rollup.config.js` [configuration file](https://www.rollupjs.org/guide/en/#configuration-files) and import the plugin:
|
29 |
|
30 | ```js
|
31 | import graphql from '@rollup/plugin-graphql';
|
32 |
|
33 | export default {
|
34 | input: 'src/index.js',
|
35 | output: {
|
36 | dir: 'output',
|
37 | format: 'cjs'
|
38 | },
|
39 | plugins: [graphql()]
|
40 | };
|
41 | ```
|
42 |
|
43 | Then call `rollup` either via the [CLI](https://www.rollupjs.org/guide/en/#command-line-reference) or the [API](https://www.rollupjs.org/guide/en/#javascript-api).
|
44 |
|
45 | With an accompanying file `src/index.js`, you can import GraphQL files or named queries/mutations:
|
46 |
|
47 | ```js
|
48 | // src/index.js
|
49 |
|
50 | // import a GraphQL Document from a GraphQL file,
|
51 | import schema from './schema.graphql';
|
52 |
|
53 | // or import named Query/Mutation
|
54 | import { BatmanQuery, JokerMutation } from './schema.graphql';
|
55 | ```
|
56 |
|
57 | #### Fragments
|
58 |
|
59 | Thanks to [graphql-tag](https://github.com/apollographql/graphql-tag), fragments import is supported by using `#import "..."`.
|
60 |
|
61 | Given the following file `heroFragment.graphql`:
|
62 |
|
63 | ```graphql
|
64 | fragment HeroFragment on Hero {
|
65 | id
|
66 | name
|
67 | }
|
68 | ```
|
69 |
|
70 | You can import it like this:
|
71 |
|
72 | ```graphql
|
73 | #import "./heroFragment.graphql"
|
74 |
|
75 | query AllHeroes {
|
76 | heros {
|
77 | ...HeroFragment
|
78 | }
|
79 | }
|
80 | ```
|
81 |
|
82 | ## Options
|
83 |
|
84 | ### `exclude`
|
85 |
|
86 | Type: `String` | `Array[...String]`<br>
|
87 | Default: `null`
|
88 |
|
89 | A [picomatch pattern](https://github.com/micromatch/picomatch), or array of patterns, which specifies the files in the build the plugin should _ignore_. By default no files are ignored.
|
90 |
|
91 | ### `include`
|
92 |
|
93 | Type: `String` | `Array[...String]`<br>
|
94 | Default: `null`
|
95 |
|
96 | A [picomatch pattern](https://github.com/micromatch/picomatch), or array of patterns, which specifies the files in the build the plugin should operate on. By default all files are targeted.
|
97 |
|
98 | ## Meta
|
99 |
|
100 | [CONTRIBUTING](/.github/CONTRIBUTING.md)
|
101 |
|
102 | [LICENSE (MIT)](/LICENSE)
|