You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
> Also, make sure you have `graphql` dependency in your project.
45
+
> Make sure you have `graphql` dependency in your project.
46
46
47
47
### Configuration
48
48
49
-
#### Tell ESLint to apply this plugin to `.graphql` files.
49
+
To get started, define an override in your ESLint config to apply this plugin to `.graphql` files. Add the [rules](docs/README.md) you want applied.
50
50
51
-
_This step is necessary even if you are declaring operations and/or schema in code files._
52
-
53
-
To get started, define an override in your ESLint config to tell ESLint to modify the way it treats `.graphql` files. Add the [rules](./docs/README.md) you want applied.
51
+
> 🚨 Important! This step is necessary even if you are declaring operations and/or schema in code files.
54
52
55
53
```json
56
54
{
@@ -60,73 +58,47 @@ To get started, define an override in your ESLint config to tell ESLint to modif
60
58
"parser": "@graphql-eslint/eslint-plugin",
61
59
"plugins": ["@graphql-eslint"],
62
60
"rules": {
63
-
"@graphql-eslint/require-description": [
64
-
"error",
65
-
{
66
-
"on": [
67
-
"ObjectTypeDefinition",
68
-
"InterfaceTypeDefinition",
69
-
"EnumTypeDefinition",
70
-
"InputObjectTypeDefinition",
71
-
"UnionTypeDefinition",
72
-
"FieldDefinition",
73
-
"DirectiveDefinition",
74
-
],
75
-
},
76
-
],
61
+
"@graphql-eslint/known-type-names": "error"
77
62
}
78
63
}
79
64
]
80
65
}
81
66
```
82
67
83
-
If your GraphQL definitions are defined only in `.graphql` files and you're only using rules that apply to individual files, you should be good to go 👍. If you would like use a remote schema or use rules that apply across the entire collection of definitions at once, see [here](#using-rules-with-constraints-that-span-the-entire-schema).
68
+
If your GraphQL definitions are defined only in `.graphql` files, and you're only using rules that apply to individual files, you should be good to go 👍. If you would like use a remote schema or use rules that apply across the entire collection of definitions at once, see [here](#using-a-remote-schema-or-rules-with-constraints-that-span-the-entire-schema).
84
69
85
-
#### Tell ESLint to apply this plugin to GraphQL definitions defined in code files.
70
+
#### Tell ESLint to apply this plugin to GraphQL definitions defined in code files
86
71
87
72
If you are defining GraphQL schema or GraphQL operations in code files, you'll want to define an additional override to extend the functionality of this plugin to the schema and operations in those files.
88
73
89
74
```diff
90
75
{
91
76
"overrides": [
92
77
+ {
93
-
+ "files": ["*.tsx", "*.ts", "*.jsx", "*.js"],
78
+
+ "files": ["*.js"],
94
79
+ "processor": "@graphql-eslint/graphql"
95
80
+ },
96
81
{
97
82
"files": ["*.graphql"],
98
83
"parser": "@graphql-eslint/eslint-plugin",
99
84
"plugins": ["@graphql-eslint"],
100
85
"rules": {
101
-
"@graphql-eslint/require-description": [
102
-
"error",
103
-
{
104
-
"on": [
105
-
"ObjectTypeDefinition",
106
-
"InterfaceTypeDefinition",
107
-
"EnumTypeDefinition",
108
-
"InputObjectTypeDefinition",
109
-
"UnionTypeDefinition",
110
-
"FieldDefinition",
111
-
"DirectiveDefinition",
112
-
],
113
-
},
114
-
],
86
+
"@graphql-eslint/known-type-names": "error"
115
87
}
116
88
}
117
89
]
118
90
}
119
91
```
120
92
121
-
Under the hood, specifying the `@graphql-eslint/graphql` processor for code files will cause `graphql-eslint/graphql` to extract the schema and operation definitions from these files into virtual GraphQL documents with `.graphql` extensions. This will allow the overrides you've defined for `.graphql` files, via `files: ["*.graphql"]`, to get applied to the definitions defined in your code files.
93
+
Under the hood, specifying the `@graphql-eslint/graphql` processor for code files will cause `graphql-eslint/graphql` to extract the schema and operation definitions from these files into virtual GraphQL documents with `.graphql` extensions. This will allow the overrides you've defined for `.graphql` files, via `"files": ["*.graphql"]`, to get applied to the definitions defined in your code files.
122
94
123
-
#### Using a remote schema or rules with constraints that span the entire schema.
95
+
#### Using a remote schema or rules with constraints that span the entire schema
124
96
125
97
Some rules require an understanding of the entire schema at once. For example, [no-unreachable-types](https://github.com/dotansimha/graphql-eslint/blob/master/docs/rules/no-unreachable-types.md#no-unreachable-types) checks that all types are reachable by root-level fields.
126
98
127
99
To use these rules, you'll need to tell ESLint how to identify the entire set of schema definitions.
128
100
129
-
If you are using [`graphql-config`](https://graphql-config.com/), you are good to go. `graphql-eslint` integrates with it automatically and will use it to load your schema!
101
+
If you are using [`graphql-config`](https://graphql-config.com), you are good to go. `graphql-eslint` integrates with it automatically and will use it to load your schema!
130
102
131
103
Alternatively, you can define `parserOptions.schema` in the `*.graphql` override in your ESLint config.
132
104
@@ -138,52 +110,52 @@ The parser allows you to specify a json file / graphql files(s) / url / raw stri
138
110
"parser": "@graphql-eslint/eslint-plugin",
139
111
"plugins": ["@graphql-eslint"],
140
112
"rules": {
141
-
"no-unused-types": ["error"]
113
+
"@graphql-eslint/no-unreachable-types": "error"
142
114
},
143
115
+ "parserOptions": {
144
116
+ "schema": "./schema.graphql"
145
117
+ }
146
118
}
147
119
```
148
120
149
-
> You can find a complete [documentation of the `parserOptions` here](./docs/parser-options.md)
121
+
> You can find a complete [documentation of the `parserOptions` here](docs/parser-options.md).
150
122
151
-
> Some rules requires type information to operate, it's marked in the docs for each rule!
123
+
> Some rules require type information to operate, it's marked in the docs for each rule!
152
124
153
125
#### Extended linting rules with siblings operations
154
126
155
127
While implementing this tool, we had to find solutions for a better integration of the GraphQL ecosystem and ESLint core.
156
128
157
-
GraphQL operations can be distributed across many files, while ESLint operates on one file at a time. If you are using GraphQL fragments in separate files, some rules might yield incorrect results, due the the missing information.
129
+
GraphQL operations can be distributed across many files, while ESLint operates on one file at a time. If you are using GraphQL fragments in separate files, some rules might yield incorrect results, due the missing information.
158
130
159
131
To workaround that, we allow you to provide additional information on your GraphQL operations, making it available for rules while doing the actual linting.
160
132
161
-
To provide that, we are using `@graphql-tools` loaders to load your sibling operations and fragments, just specify a glob expression(s) that points to your code/.graphql files:
133
+
To provide that, we are using `graphql-tools` loaders to load your sibling operations and fragments, just specify a glob expression(s) that points to your code/`.graphql` files:
162
134
163
135
```diff
164
136
{
165
137
"files": ["*.graphql"],
166
138
"parser": "@graphql-eslint/eslint-plugin",
167
139
"plugins": ["@graphql-eslint"],
168
140
"rules": {
169
-
"unique-operation-name": ["error"]
141
+
"@graphql-eslint/unique-operation-name": "error"
170
142
},
171
143
"parserOptions": {
172
-
+ "operations": ["./src/**/*.graphql"],
144
+
+ "operations": "./src/**/*.graphql",
173
145
"schema": "./schema.graphql"
174
146
}
175
147
}
176
148
```
177
149
178
150
### VSCode Integration
179
151
180
-
By default, [ESLint VSCode plugin](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint) will not lint files with extensions other then js, jsx, ts, tsx.
152
+
By default, [ESLint VSCode plugin](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint) will not lint files with extensions other than `js`, `jsx`, `ts` and `tsx`.
181
153
182
154
In order to enable it processing other extensions, add the following section in `settings.json` or workspace configuration.
The original `prettier` rule has been removed because `eslint-plugin-prettier` supports `.graphql` files well actually.
247
-
248
-
All you need to do is like the following for now:
212
+
`eslint-plugin-prettier` supports `.graphql` files. You need to do the following:
249
213
250
214
```js
251
-
// .eslintrc.js
252
215
module.exports= {
253
216
overrides: [
254
217
{
255
218
files: ['*.js'],
256
219
processor:'@graphql-eslint/graphql',
257
-
extends: ['plugin:prettier/recommended'],
220
+
extends: ['plugin:prettier/recommended']
258
221
},
259
222
{
260
223
files: ['*.graphql'],
261
224
parser:'@graphql-eslint/eslint-plugin',
262
225
plugins: ['@graphql-eslint'],
263
226
rules: {
264
-
'prettier/prettier':'error',
265
-
},
227
+
'prettier/prettier':'error'
228
+
}
266
229
},
267
230
// the following is required for `eslint-plugin-prettier@<=3.4.0` temporarily
268
231
// after https://github.com/prettier/eslint-plugin-prettier/pull/415
269
232
// been merged and released, it can be deleted safely
270
233
{
271
234
files: ['*.js/*.graphql'],
272
235
rules: {
273
-
'prettier/prettier':'off',
274
-
},
275
-
},
276
-
],
277
-
};
236
+
'prettier/prettier':'off'
237
+
}
238
+
}
239
+
]
240
+
}
278
241
```
279
242
280
243
You can take [`examples/prettier`](examples/prettier/.eslintrc.js) as example.
281
244
282
-
It could be better to remove the unnecessary `*.js/*.graphql`overrides setting if <https://github.com/prettier/eslint-plugin-prettier/pull/415> will be merged and released.
245
+
It could be better to remove the unnecessary `*.js/*.graphql`override setting if <https://github.com/prettier/eslint-plugin-prettier/pull/415> will be merged and released.
283
246
284
247
Please help to vote up if you want to speed up the progress.
285
248
286
249
## Further Reading
287
250
288
-
If you wish to learn more about this project, how the parser works, how to add custom rules and more, [please refer to the docs directory](./docs/README.md))
251
+
If you wish to learn more about this project, how the parser works, how to add custom rules and more, [please refer to the docs directory](docs/README.md).
289
252
290
253
## Contributions
291
254
@@ -295,8 +258,8 @@ And if this is your first time contributing to this project, please do read our
295
258
296
259
### Code of Conduct
297
260
298
-
Help us keep GraphQL ESLint open and inclusive. Please read and follow our [Code of Conduct](https://github.com/the-guild-org/Stack/blob/master/CODE_OF_CONDUCT.md) as adopted from [Contributor Covenant](https://www.contributor-covenant.org/)
261
+
Help us keep GraphQL ESLint open and inclusive. Please read and follow our [Code of Conduct](https://github.com/the-guild-org/Stack/blob/master/CODE_OF_CONDUCT.md) as adopted from [Contributor Covenant](https://contributor-covenant.org).
0 commit comments