Support extracting GraphQL documents from `vue`/`svelte` files

Describe the bug Linting vue files with the graphql plugin enabled leads to the following error:

[graphql-eslint/processor]: Unable to process file "D:\Programming\JabRefOnline\pages\user\register.vue":  SyntaxError: Unexpected token, expected "</>/<=/>=" (3:12)
    at Object._raise (D:\Programming\JabRefOnline\node_modules\@graphql-tools\graphql-tag-pluck\node_modules\@babel\parser\lib\index.js:776:17)
    at Object.raiseWithData (D:\Programming\JabRefOnline\node_modules\@graphql-tools\graphql-tag-pluck\node_modules\@babel\parser\lib\index.js:769:17)
    at Object.raise (D:\Programming\JabRefOnline\node_modules\@graphql-tools\graphql-tag-pluck\node_modules\@babel\parser\lib\index.js:737:17)
    at Object.unexpected (D:\Programming\JabRefOnline\node_modules\@graphql-tools\graphql-tag-pluck\node_modules\@babel\parser\lib\index.js:9253:16)
    at Object.expectRelational (D:\Programming\JabRefOnline\node_modules\@graphql-tools\graphql-tag-pluck\node_modules\@babel\parser\lib\index.js:9191:12)
    at Object.tsParseTypeAssertion (D:\Programming\JabRefOnline\node_modules\@graphql-tools\graphql-tag-pluck\node_modules\@babel\parser\lib\index.js:6182:10)
    at Object.parseMaybeUnary (D:\Programming\JabRefOnline\node_modules\@graphql-tools\graphql-tag-pluck\node_modules\@babel\parser\lib\index.js:7224:19)
    at Object.tsParseTypeAssertion (D:\Programming\JabRefOnline\node_modules\@graphql-tools\graphql-tag-pluck\node_modules\@babel\parser\lib\index.js:6183:28)
    at Object.parseMaybeUnary (D:\Programming\JabRefOnline\node_modules\@graphql-tools\graphql-tag-pluck\node_modules\@babel\parser\lib\index.js:7224:19)
    at Object.parseExprOps (D:\Programming\JabRefOnline\node_modules\@graphql-tools\graphql-tag-pluck\node_modules\@babel\parser\lib\index.js:10141:23) {
  loc: Position { line: 3, column: 12 },
  pos: 33
}

To Reproduce Enable linting of vue files using the plugin by specifying the following override:

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

and invoke eslint --ext .graphql,.vue. The error appears and points to the first instance where a html tag has some attribute, e.g. the above error is created by the following register.vue file:

<template>
  <div>
    <Portal to="header">
     ....

Expected behavior No error, and linting of the vue file proceeds.

Environment:

• OS: Win 10
• @graphql-eslint/...: 1.0.1
• NodeJS: 14

Additional context

According to the documentation, graphql-tag-pluck should be able to parse vue files so hopefully this is only a config problem.

[tobiasdiez]

Okay, here you go: https://stackblitz.com/edit/github-7j6u77?file=.eslintrc.cjs,test.vue I’ve only added the small processor config to the basic example. This is already enough to trigger the issue.

[B2o5T]

Closing due to inactivity. Please feel free to reopen if you still need help.