Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Using ApolloClient with node.js. "fetch is not found globally and no fetcher passed"

I am attempting to use an Apollo Client on a node.js server to interface with another GraphQL API using the following code:

import fetch from 'node-fetch' import { createHttpLink } from 'apollo-link-http'  import ApolloClient from 'apollo-boost' import { API_URL } from '...'  const client = new ApolloClient({   link: createHttpLink({     uri: API_URL,     fetch: fetch,   }), }) 

Which yields the following error:

module initialization error: Error fetch is not found globally and no fetcher passed, to fix pass a fetch for your environment like https://www.npmjs.com/package/node-fetch.  For example: import fetch from 'node-fetch'; import { createHttpLink } from 'apollo-link-http';  const link = createHttpLink({ uri: '/graphql', fetch: fetch }); at Object.checkFetcher (/var/task/node_modules/apollo-link-http-common/lib/bundle.umd.js:78:19) at createHttpLink (/var/task/node_modules/apollo-link-http/lib/bundle.umd.js:32:30) at new HttpLink (/var/task/node_modules/apollo-link-http/lib/bundle.umd.js:203:38) at new DefaultClient (/var/task/node_modules/apollo-boost/lib/index.js:80:24) 

I understand that the Apollo Client by default is expecting to be run in a browser context where a fetch method will be available, and that in a node.js I need to polyfill or otherwise provide a fetch method, but I having trouble figuring out exactly how to do this.

Following the example code at https://www.apollographql.com/docs/link/#apollo-client it appears that I should be able to pass this information in using the link option, and reading the apollo-boost source code seems to suggest that you can pass this information in using fetcherOptions, but neither of these solutions seem to work.

Can anyone provide some example code for initializing an Apollo Client in node.js with a fetcher?

For reference here is my package.json

{   "name": "API-Service",   "version": "1.0.0",   "description": "",   "private": true,   "scripts": {},   "dependencies": {     "apollo-boost": "^0.1.6",     "apollo-link-http": "^1.5.4",     "graphql": "^0.13.2",     "babel-polyfill": "^6.26.0",     "json-rules-engine": "^2.1.0",     "node-fetch": "^2.1.2",     "mysql": "^2.15.0"   } } 
like image 213
Nathan Avatar asked Jun 04 '18 21:06

Nathan


1 Answers

If you still want to use Apollo Boost in Node.js but need to polyfill the native fetch API of the browser, try out cross-fetch. I used it for my minimal example over here. And that's how it can be used after installing it:

import 'cross-fetch/polyfill'; import ApolloClient from 'apollo-boost';  const client = new ApolloClient({   uri: 'https://api.domain.com/graphql', }); 
like image 108
Robin Wieruch Avatar answered Oct 19 '22 21:10

Robin Wieruch