eslint-plugin-relay
is a plugin for ESLint to catch common problems in code using Relay early.
Install
npm i --save-dev eslint-plugin-relay
How To Use
- Add
"relay"
to your eslintplugins
section. - Add the relay rules such as
"relay/graphql-syntax": "error"
to your eslintrules
section, see the example for all rules.
Example .eslintrc.js:
module.exports = {
// Other eslint properties here
rules: {
'relay/graphql-syntax': 'error',
'relay/compat-uses-vars': 'warn',
'relay/graphql-naming': 'error',
'relay/generated-flow-types': 'warn',
'relay/must-colocate-fragment-spreads': 'warn',
'relay/no-future-added-value': 'warn',
'relay/unused-fields': 'warn',
'relay/function-required-argument': 'warn',
'relay/hook-required-argument': 'warn'
},
plugins: ['relay']
};
You can also enable all the recommended or strict rules at once.
Add plugin:relay/recommended
or plugin:relay/strict
in extends
:
{
"extends": [
"plugin:relay/recommended"
]
}
Suppressing rules within graphql tags
The following rules support suppression within graphql tags:
- relay/unused-fields
- relay/must-colocate-fragment-spreads
Supported rules can be suppressed by adding # eslint-disable-next-line relay/name-of-rule
to the preceding line:
graphql`fragment foo on Page {
# eslint-disable-next-line relay/must-colocate-fragment-spreads
...unused1
}`
Note that only the eslint-disable-next-line
form of suppression works. eslint-disable-line
doesn't currently work until graphql-js provides support for parsing Comment nodes in their AST.
Contribute
We actively welcome pull requests, learn how to contribute.
License
eslint-plugin-relay
is MIT licensed.