apollo: Can't override cache option from apollo config

Version

v4.0.0-beta.5

Reproduction link

https://gist.github.com/tomdavies/b88c68110333c5754f81f785ec0f270d

Steps to reproduce

I’m attempting to override the cache in my apollo config so as to be able to define a fragmentMatcher

The relevant bit of my nuxt,config.js looks like this:

module.exports = {
  ...
  // Modules
  modules: ['@nuxtjs/apollo'],
  apollo: {
    // tokenName: 'yourApolloTokenName', // optional, default: apollo-token
    includeNodeModules: true, // optional, default: false (this includes graphql-tag for node_modules folder)
    authenticationType: 'Bearer', // optional, default: 'Bearer'
    // required
    clientConfigs: {
      default: {
        httpEndpoint: GRAPHQL_ENDPOINT,
        cache: new InMemoryCache({ fragmentMatcher }),
      },
    },
  },
  ...
}

What is expected ?

The Apollo cache is replaced with the InMemoryCache passed in the cache key of clientConfigs, with the fragmentMatcher applied

What is actually happening?

A TypeError is thrown:

cache.transformDocument is not a function

Looking in my generated .nuxt/apollo-module.js (included in Gist) it looks as if the cache option I pass is getting stringified somewhere (?)

Additional comments?

The issue described here seems relevant and involves the same error message but doesn’t describe a fix.

PS I’m something of a noob when it comes to Apollo so apologies if I’ve missed something stupid

<div align="right">_{This bug report is available on Nuxt community (#c103)}</div>

About this issue

Original URL
State: closed
Created 6 years ago
Comments: 20 (9 by maintainers)

Most upvoted comments

@sahilranpuri I’ve been using it like this since at least rc2.0 and it’s working as expected.

// nuxt.config.js

apollo: {
  clientConfigs: {
    default: '~/apollo/config.js'
  }
},

// /apollo/config.js

import cache from './cache'

export default function(ctx) {
  const token = process.env.token
  return {
    httpEndpoint: `https://endpoint.com`,
    getAuth: () => `Bearer ${token}`,
    cache
  }
}

// /apollo/cache.js

import { InMemoryCache, IntrospectionFragmentMatcher } from 'apollo-cache-inmemory'
import introspectionQueryResultData from './fragmentTypes.json'

const fragmentMatcher = new IntrospectionFragmentMatcher({
  introspectionQueryResultData
})

export default new InMemoryCache({ fragmentMatcher })

+24

papertokyo on Apr 11, 2019

Used @papertokyo method. Finally got rid of all errors and everything works as intended! Thanks!

Big question though… my fragmentTypes.json file is… empty! I was trying to understand how to use it, as it wasn’t clear to me how to write its content, when I noticed it didn’t really matter. At the moment this is it:

{
  "__schema": {
    "types": [
    ]
  }
}

Why does it work? What should be inside and how would make a difference?

Saurou on Jul 27, 2020

During development of a project, i was in a case where my graphql schema changes so instead of create a file manually each time i used nuxt hooks to fetch my schema and write the result in my schema file.

If anyone is interested here is the code: in your nuxt.config.js file add

  hooks: {
    build: {
      before (builder) {
        axios.post('MySuperGraphqlEndpoint', {
          query: `
            query schema{
              __schema{
                types{
                  kind
                  name
                  possibleTypes {
                    name
                    description
                  }
                }
              }
            }`
        }).then(({ data }) => {
          fs.writeFile('apollo/client-configs/schema.json', JSON.stringify(data.data) + '\r\n', ((err) => {
            if (err) {
              /* eslint-disable-next-line */
              console.log(err)
            }
          }))
        })
      }
    }
  },

yaki4 on Jul 2, 2020

I published a new release https://github.com/nuxt-community/apollo-module/releases/tag/v4.0.0-beta.6 Now you should be able to provide a path to your config and return your config as shown in the example. Please report back if this fixes your current issue

dohomi on Jul 8, 2018

@papertokyo this is a permanent solution!! You saved 2 days of my life. Thank you !!!

set on Jun 30, 2020

@dohomi Thanks, rc0 has fixed the issue – I’m back to using the same config I was with v3.

timhanlon on Jul 18, 2018

Thanks for the releas @dohomi, back on the project that’s using this tomorrow so will update and test then

tomdavies on Jul 10, 2018