graphqlHTTP is not a function

Javascriptnode.jsExpressGraphqlExpress Graphql

Javascript Problem Overview


Here is my simple graphql express app

const express = require('express');
const graphqlHTTP = require('express-graphql');

const app = express();
app.use(
    '/graphql',
    graphqlHTTP({
      graphiql: true,
    })
  );

app.listen(4000, () => {
    console.log("listening for request!");
});

I'm getting the following errors when I run it:

 graphqlHTTP({
    ^

TypeError: graphqlHTTP is not a function
    at Object.<anonymous> (D:\PersonalProjects\GraphQL\server\app.js:7:5)
    at Module._compile (internal/modules/cjs/loader.js:1138:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1158:10)
    at Module.load (internal/modules/cjs/loader.js:986:32)
    at Function.Module._load (internal/modules/cjs/loader.js:879:14)
    at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:71:12)  
    at internal/main/run_main_module.js:17:47

How can I fix it? Thanks in advance!

Javascript Solutions


Solution 1 - Javascript

Look at the documentation:

> const { graphqlHTTP } = require('express-graphql');

Note that it uses destructuring equivalent to:

const graphqlHTTP = require('express-graphql').graphqlHTTP;

require('express-graphql') returns an object with a property called graphqlHTTP that is the function you want to call.

You're trying to call the object itself as if it was a function.

Solution 2 - Javascript

Quentin's answer was on spot. Apparently the npm documentation was updated but some of the tutorials on YouTube were not. That's why there's a certain degree of confusion for learners like myself. There are still outdated versions of the code like

This one: https://github.com/iamshaunjp/graphql-playlist/blob/lesson-36/server/app.js

This one: https://github.com/WebDevSimplified/Learn-GraphQL/blob/master/server.js

Or this one: https://github.com/bradtraversy/customerbase/blob/master/server.js

They should all be updated to

const { graphqlHTTP } = require('express-graphql');

and then

app.use('/graphql', graphqlHTTP({
    schema:schema,
    graphiql:true
}));

Solution 3 - Javascript

You can use

const gqlHTTP = require('express-graphql');

app.use('/graphql', gqlHTTP.graphqlHTTP({
 // something
}))

Solution 4 - Javascript

Just to make it more clear:

Before "express-graphql" was returning a direct function or a class with the function and we could assign it to any variable like graphqlServer

const graphqlServer = require('express-graphql');

Now, it returns the whole object that has a function inside it named "graphqlHTTP". hence the code should be exactly

const { graphqlHTTP } = require('express-graphql');

and to make a connection,

app.use('/graphql', graphqlHTTP({
    // your config
})); 

Solution 5 - Javascript

At first you need destructure

const { graphqlHTTP } = require('express-graphql');

Learn more

Solution 6 - Javascript

Had the same issue solved by the above answers.

For anyone wondering, express-graphql version 0.10.0 is where the relevant change started so you can check your package.json express-graphql dependency version number.

https://www.npmjs.com/package/express-graphql/v/0.9.0
https://www.npmjs.com/package/express-graphql/v/0.10.0

Solution 7 - Javascript

This code was written with an earlier version of express-graphql.

Prior to v0.10.0, you could use

var graphqlHTTP = require('express-graphql');

After v0.10.0, you need to use

var { graphqlHTTP } = require('express-graphql');

Solution 8 - Javascript

Simple Setup:

DO NOT USE YOUR OWN PARAMETER STRICTLY USE { graphqlHTTP }!!!!

Just mount express-graphql as a route handler:

const express = require('express');
const { graphqlHTTP } = require('express-graphql');
 
const app = express();
 
app.use(
  '/graphql',
  graphqlHTTP({
    schema: MyGraphQLSchema,
    graphiql: true,
  }),
);
 
app.listen(4000, () => {
    console.log('Server is running on port 4K')
);

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionSachin TitusView Question on Stackoverflow
Solution 1 - JavascriptQuentinView Answer on Stackoverflow
Solution 2 - JavascriptHuyView Answer on Stackoverflow
Solution 3 - Javascriptsaichandra2896View Answer on Stackoverflow
Solution 4 - JavascriptChandana DeshmukhView Answer on Stackoverflow
Solution 5 - JavascriptMD SHAYONView Answer on Stackoverflow
Solution 6 - JavascriptAlbert LeeView Answer on Stackoverflow
Solution 7 - JavascriptCodemakerView Answer on Stackoverflow
Solution 8 - JavascriptLarry DaBig MeechView Answer on Stackoverflow