support /* GraphQL */ among other patterns

When trying VSCode after Atom, I noticed that not all graphql scheama definitions are correctly found. Here’s the one I struggled with:

export default /* GraphQL */ `
# graphql types etc. (expected to be highlighted, but it did not)
`;

I guess this can be fixed by tweaking begin in syntaxes/graphql.js.json, which currently equals to:

"begin": "(Relay\\.QL|gql|graphql(\\.experimental)?)(`)",

In Atom’s language-babel package the definition of a similar concept is a bit more complex:

"begin": "\\s*+(?:((Relay)(?:(\\?\\.)|(\\.))(QL))|(gql|graphql|graphql\\.experimental)|(/\\* GraphQL \\*/))\\s*((`))",

In addition to /* GraphQL */, looks like the latter RegExp also supports spacing between a template literal and ` (e.g. both graphql` and graphql `).

I’m not sure I’ll be ready to submit a PR because I’m new to VSCode and won’t find enough time to go through all potential difficulties of a newcomer. But still hope that my mini-investigation helps!

WDYT @kumarharsh? BTW thanks a lot for this handy extension! 💯

[cjhowedev]

Another reason to support this is that prettier will format this:

export default `#graphql
  ...your graphql code here
`;

to this:

export default `
  #graphql
  ...your graphql code here
`;

which will break highlighting. This makes it a non-option for prettier users. The comment form doesn’t have this issue.

[kachkaev]

Thanks for hinting on export default `#graphql! That’s useful, but I guess it’d be still great to support /* GgraphQL */ ` too, at least because it’s already supported by the Atom’s package. Others switching to vscode may have similar expectations and get confused as well.

I’ve seen /* GgraphQL */ ` in a few places around github and I guess its’ a convention of some sort (perhaps, even a wider one, not just GraphQL-specific) 😉 I’m using it in apollo-server, where you don’t need to apply a graphql string literal when defining a schema – the string is just passed to makeExecutableSchema later on.