ardatan / graphql-import-node

Import 'graphql' files in NodeJS

GraphQL Import Node

This extension makes your NodeJS application able to import graphql files. It uses require.extensions to allow you to import/require from .graphql files in NodeJS environment. The imported content will be a compiled version of the GraphQL string (DocumentNode).

It needs to be installed graphql on the project. Then, you can install it using npm or yarn;

yarn add graphql-import-node

After that, you need to load this library before anything else.

Usage with Node (JavaScript)

Make sure to run your NodeJS process with -r flag:

node -r graphql-import-node/register index.js

Or, you can require it manually in your index file:

// CommonJS
require('graphql-import-node/register');

// ES2016
import 'graphql-import-node';

Now you should be able to do:

const schema = require('./schema.graphql');

Usage with TypeScript

If you are using TypeScript (with ts-node or ts-node-dev), make sure to add the same -r graphql-import-node/register flag:

ts-node -r graphql-import-node/register index.ts

or to have typings for *.graphql files it'd better to add the import the library like below;

import 'graphql-import-node';

Now you should be able to do:

import * as schema from './schema.graphql';

Usage with Jest

If you are running a test environment like Jest, you should add the following configuration to your Jest config:

{
  "transform": {
    "^.+\\.graphql$": "graphql-import-node/jest"
  }
}

graphql-import-node's Issues

This library does not work with ESM mode

Import in node when using *.mjs doesn't work, as import doesn't use require.extensions.

.graphql files not available after tsc build

I am using this module and it seems to be working for development well. I have following script setup

"scripts": {
    "dev": "nodemon --exec ts-node src/main.ts",
    "build": "tsc",
    "start": "node dist/main.js"
  },

My main.ts file

import 'graphql-import-node'
import 'reflect-metadata'
import { appModule } from './modules/app';
import { ApolloServer } from 'apollo-server';

const { schema, context } = appModule;

const server = new ApolloServer({ 
  schema,
  context,
  introspection: true,
});

server.listen().then(server => {
  console.log(`Server listening on ${server.url}`)
});

tsconfig.json file

{
  "compilerOptions": {
    "baseUrl": ".",
    "allowSyntheticDefaultImports": true,
    "esModuleInterop": true,
    "experimentalDecorators": true,
    "module": "commonjs",
    "target": "es6",
    "lib": ["es6", "esnext", "es2015"],
    "noImplicitAny": false,
    "suppressImplicitAnyIndexErrors": true,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "sourceMap": true,
    "declaration": true,
    "outDir": "./dist",
    "rootDir": "./src"
  },
  "files": ["src/main.ts"],
  "include": ["src/**/*"],
  "exclude": ["node_modules", "**/*.spec.ts"]
}

Now this works when I do npm run dev just fine. npm run build also builds in dist folder fine. But when I run npm start, It shows missing .graphql error. I see .graphql files are not being copied.

Cannot set property '.graphql' of undefined after Webpack build

Hi,
I'm trying to build my project with webpack.
Everything is good but when i'm running my project , i see that error

webpack-internal:///./node_modules/graphql-import-node/register.js:13
  (void 0)[`.${ext}`] = handleModule;

do you have a clue on what is going on ?
thank you for your time :)

Module could not be found from *.gql

Hello,

Did someone made it work on IOS using javascript ( not ts as in the example)?
I get the classical error message :

 Unable to resolve module `./myQuery.gql` from `/Users/naruto/Documents/TestProject/src/components/MyCompA.js`: The module `./myQuery.gql` could not be found from `/Users/naruto/Documents/TestProject/src/components/MyCompA.js`. Indeed, none of these files exist:
   * `/Users/naruto/Documents/TestProject/src/components/myQuery.gql(.native||.ios.js|.native.js|.js|.ios.json|.native.json|.json|.ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|.tsx)`

"dependencies": {
"graphql-import-node": "0.0.1",
"react": "16.6.1",
"react-native": "0.57.5"
},
"devDependencies": {
"babel-jest": "23.6.0",
"jest": "23.6.0",
"metro-react-native-babel-preset": "0.49.2",
"react-test-renderer": "16.6.1"
},

Update readme with 'dynamicImport' Babel dependency

npm i @babel/plugin-syntax-dynamic-import --save-dev

.babelrc

{
 ...
  "plugins": ["@babel/plugin-syntax-dynamic-import"]
}

typescript is not compiling without "import 'graphql-import-node';"

typescript is not compiling without "import 'graphql-import-node';"

I added "graphql-import-node" to package.json

but IDE redlined "import * as schema from './schema.graphql'"
till I added import 'graphql-import-node'; to index.ts
so please update readme.ts

Jest import looses doc.loc.source due to JSON.stringify

Per issue laid out in apollographql/graphql-tag#115, stringifying gql DocumentNode loose doc.loc.source property since its not enumerable anymore.

Looking at the code, jest import utilizes stringification which makes it so the returned DocuemntNote encounters errors such as apollographql/graphql-tag#64 when used with graphql-tag.

I'd recommend patching the jest code to apply the same/similar fix in apollographql/graphql-tag#65 to address the issue.

How to import all .graphql files in one for easy import

Is there a way to club all .graphql files in one single file and later import the single file wherever required.
In the node_modules/graphql-import-node/register.d.ts I do see a module named *.graphqls but no associated documentation.