Import gql/graphql files into variables

Expo SDK
1

Is there any solution to import .graphql/.gql files into variables with expo.io?
In react it’s possible by a simple config in the webpack:

  // GraphQL query LOADER
          {
            test: /\.(graphql|gql)$/,
            exclude: /node_modules/,
            loader: 'graphql-tag/loader',
          },

I found this scripts, and try to change _universe/rn-cli.config.js but i couldn’t make it work (my knowledges in server config are very poor):
https://github.com/bamlab/react-native-graphql-transformer

2

Metro doesn’t support custom loaders like that I believe. Maybe you could write a custom Babel plugin but you’d probably need to read through the Metro bundler code to figure out what to do. The code is here: https://github.com/facebook/metro.

3

Hey @jonas! Babel plugin named babel-plugin-inline-import-graphql-ast should be able to do exactly this. (At least it’s mentioned in the readme for graphql-tag.) You can add the plugin in .babelrc.

1 Like
4

Thanks @ide and @fson for your quick answers and kind support.
@ide I’m not sure I’ve the skill to develop such plugin yet. But I would love to be able to do it one day.
@fson this plugin seems to work fine but it doesn’t support #fragments importation.

I’ve a folder tree with lot of Graphql queries. Many of them directly import fragment definitions from same folder tree. I use it also for the react web application and it’s why I’m looking for a solution that could work the same way to be able to share this graphql library folder.

5

@fson sorry, I had read too fast … the fragment was not supported Prior to v1.2.0.

But since then it works. So thank you very much for the solution, it’s exactly what I needed!

1 Like
6

@jonas – Glad to hear that @fson’s solution is working for you!