How to support ‘.gql’ files for EsLint and Prettier in VS Code

In my project I have some .gql files:
src/components/mycomponent/MyComponent.gql

import { gql } from '@apollo/client';

export default gql`
  query MyQuery {
    myQuery {
      test
    }
  }
`

In my VS Code settings file I added:

// .vscode/settings.json
{
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    "astro",
    "typescript",
    "typescriptreact",
    "gql"
  ],

 // rest of the config
}

In tsconfig.json I added "src/**/*.gql", to the include:

"include": [
    "src/**/*.ts",
    "src/**/*.tsx",
    "src/**/*.astro",
    "src/**/*.gql",
    "test/*.ts",
    "globals.d.ts",
    "*.cjs",
    ".*.cjs",
    "vitest.config.ts",
    "astro.config.mjs",
    "codegen.ts"
  ]

Somehow VS Code Eslint and Prettier are ignoring this file? How to fix this?