On this page

Usage with eslint-plugin-prettier

Usage with eslint-plugin-prettier — GraphQL ESLint documentation.

ESLint Flat Config

eslint.config.js
import prettierConfig from 'eslint-config-prettier'
import prettierPlugin from 'eslint-plugin-prettier'
import js from '@eslint/js'
import graphqlPlugin from '@graphql-eslint/eslint-plugin'

export default [
  {
    plugins: {
      prettier: { rules: prettierPlugin.rules }
    }
  },
  {
    files: ['**/*.js'],
    processor: graphqlPlugin.processor,
    rules: {
      ...js.configs.recommended.rules,
      ...prettierConfig.rules,
      ...prettierPlugin.configs.recommended.rules
    }
  },
  {
    files: ['**/*.graphql'],
    languageOptions: {
      parser: graphqlPlugin.parser
    },
    plugins: {
      '@graphql-eslint': graphqlPlugin
    },
    rules: {
      'prettier/prettier': 'error'
    }
  }
]

ESLint Legacy Config

.eslintrc.cjs
/**
 * Legacy config example, should be run with `ESLINT_USE_FLAT_CONFIG=false` environment variable in ESLint 9
 */

module.exports = {
  root: true,
  overrides: [
    {
      files: ['*.js'],
      processor: '@graphql-eslint/graphql',
      extends: ['eslint:recommended', 'plugin:prettier/recommended'],
      env: {
        es2022: true
      },
      parserOptions: {
        sourceType: 'module'
      }
    },
    {
      files: ['*.graphql'],
      parser: '@graphql-eslint/eslint-plugin',
      plugins: ['@graphql-eslint'],
      rules: {
        'prettier/prettier': 'error'
      }
    }
  ]
}