Skip to main content
View plugin on GitHub
See starters using this

gatsby-theme-apollo

A Gatsby theme that sets up your website for use with Apollo Client.

Installation

This theme is meant to be used with the @apollo/client package. If you aren’t already using it, make sure you install it along with this theme.

Important: @apollo/client is currently in beta. If you want to use this theme with apollo-boost or apollo-client, you can install gatsby-theme-apollo@2.

npm install gatsby-theme-apollo @apollo/client

Usage

Add gatsby-theme-apollo as a plugin in your Gatsby config.

// gatsby-config.js
module.exports = {
  plugins: ['gatsby-theme-apollo']
};

Required: Shadow this theme’s client.js file with your own ApolloClient instance. Check out the Apollo docs to learn more about creating a client.

However you decide to create your client, you should make sure that:

  1. You provide an isomorphic fetch implementation (such as isomorphic-fetch) as an option to HttpLink
  2. Your client is the default export in client.js
// src/gatsby-theme-apollo/client.js
import fetch from 'isomorphic-fetch';
import {ApolloClient, HttpLink, InMemoryCache} from '@apollo/client';

const client = new ApolloClient({
  cache: new InMemoryCache(),
  link: new HttpLink({
    uri: 'https://api.spacex.land/graphql/',
    fetch
  })
});

export default client;

License

MIT


Docs
Tutorials
Plugins
Blog
Showcase