Import directive within GraphQL files

[hmaurer]

Hi!

I am opening this issue to ask whether the addition of an import directive in GraphQL (.graphql) files has been considered and/or is currently being worked on. To be more specific, I am referring to the #import syntax used by webpack-graphql-loader, like so:

#import "./fragments.graphql"
 
query {
  ...a
  ...b
}

The implementation by webpack-graphql-loader is a little dirty but pragmatic (they essentially do a search-and-replace for "#import" directives).

Since this is also the recommended approach in Apollo's documentation, I think that it would be a useful addition to Parcel.

I did not open this issue as a feature request because if this is not something currently being worked on I would be happy to contribute myself.

[DeMoorJasper]

Haven't seen anyone working on it.
Would be nice if you could implement it :)

[agonbina]

@hmaurer did you ever get around implementing this feature? I am not even sure how else do you share fragments between queries/mutations unless you are able to import them in the .graphql somehow.

[hmaurer]

HI @agonbina ! No, sorry :( I moved away from .graphql files to defining the queries/fragments in my .js files and so I didn't have a pressing need for this feature. I do agree it seems pretty much essential when working with .graphql files though but I don't have the time to implement it right now.

[agonbina]

There is a workaround to get this to work and still keep your fragments in .graphql files. Here is an example with react-apollo

import { concatAST } from 'graphql'
import { graphql } from 'react-apollo'

import customerFragment from './customer.fragment.graphql'
import customerQuery from './customer.graphql'

export const withCustomer = graphql(concatAST([customerFragment, customerQuery]), {
  name: 'customerQuery'
})

It is more cumbersome but on the other hand you don't need to use the #import directive which is not party of the graphql spec anyway. And the visual studio code extension for GraphQL is able to find and understand the fragments that you use in your queries/mutations.

[nabiltntn]

I created PR #1817 to add this feature