graphql-eslint: Operations inside graphql`` statements are not being linted

Not sure if this is a bug or just a feature: I have .graphql schema files being properly linted, but we use relay and our operations are defined inside graphql statements rather than gql and it seems the linter isn’t finding them. I was sure to add the following as an override per the instructions:

  {
    files: ['*.tsx', '*.ts'],
    processor: '@graphql-eslint/graphql',
  },

About this issue

  • Original URL
  • State: closed
  • Created 2 years ago
  • Comments: 16 (5 by maintainers)

Most upvoted comments

Can we document this in README? I wasted 2 hours to find this issue and fix the same problem.

@B2o5T I was able to fix the issue on my end; we initialize ESLint at a point in our front end linting workflow and .graphql needed to be added to the extensions property array. Thanks for trying to help.

@Dodie324 I had the same issue with the following eslint configuration file and lint command: .eslintrc.js:

module.exports = {
  // root level parser, extends, plugins, ... for the typescript eslint configurations
  overrides: [
    {
      files: ['*.ts'],
      processor: '@graphql-eslint/graphql',
    },
    {
      files: ['*.graphql'],
      parser: '@graphql-eslint/eslint-plugin',
      plugins: ['@graphql-eslint'],
      parserOptions: {
        'schema': './schema.graphql'
      },
      rules: {
        '@graphql-eslint/no-deprecated': 'error'
      }
    },
  ]
}

lint command:

eslint --ext ts,js,tsx,jsx src/

There were two problems:

  1. we should avoid defining any top-level configurations as mentioned here https://github.com/B2o5T/graphql-eslint/blob/master/examples/code-file/.eslintrc.cjs. So, the new .eslintrc.js is:
module.exports = {
  overrides: [
    {
      files: '*.[jt]s?(x)',
      // former root level parser, extends, plugins, ... for the typescript eslint configurations
    }
    {
      files: ['*.ts'],
      processor: '@graphql-eslint/graphql',
    },
    {
      files: ['*.graphql'],
      parser: '@graphql-eslint/eslint-plugin',
      plugins: ['@graphql-eslint'],
      parserOptions: {
        'schema': './schema.graphql'
      },
      rules: {
        '@graphql-eslint/no-deprecated': 'error'
      }
    },
  ]
}
  1. add .graphql extension to the --ext of the lint command (I think @BrianBusby meant this!). However, we could completely eliminate the extensions with the new configuration, so the new lint command would be: eslint src/.

I hope it helps you!

Having similar issues as @BrianBusby. I’m trying to migrate from eslint-plugin-graphql, but not sure this package is actually validating my queries/mutations written inside a .ts file.

Here is my config setup:

overrides: [
    {
      files: ['*.ts'],
      processor: '@graphql-eslint/graphql',
    },
    {
      files: ['*.graphql'],
      parser: '@graphql-eslint/eslint-plugin',
      plugins: ['@graphql-eslint'],
      rules: {
        '@graphql-eslint/no-duplicate-fields': 'error',
        '@graphql-eslint/no-deprecated': 'error',
      },
    },
  ],

Take a look of this example with code files https://github.com/B2o5T/graphql-eslint/blob/master/examples/code-file/.eslintrc.cjs You have an incorrect eslint configuration, split it to overrides sections