Use Apollo with Gatsby (or SSR)

So the short of it is, you need to use `isomorphic-fetch`.

There's no point me repeating what's already been said well in the apollo-docs, so start there for setting up apollo-client. However you might find everything is working in dev mode, but your project won't build 😔.

Here's the fix, first:

npm install isomorphic-fetch
# OR
yarn add isomorphic-fetch

Then, where you have initialised your apollo client you need to:

import ApolloClient from 'apollo-boost';
import fetch from 'isomorphic-fetch'

const client = new ApolloClient({
  fetch,
  uri: 'https://48p1r2roz4.sse.codesandbox.io',
});

Why? It's because the ApolloClient by default uses the browser fetch api, and because Gatsby statically builds your website in node (and fetch doesn't exist in node). Luckily the ApolloClient configeration options allow us to pass in a fetch compatiable api, of which isomorphic-fetch fits the bill nicely 👌.

Reference:

Apollo react docs again
isomorphic-fetch
Github issue that help me solve this initially

Did you know you can get Electronic-Mail sent to your inter-web inbox, for FREE !?!?
You should stay up-to-date with my work by signing up below.