apollo-client: ApolloClient with InMemoryCache throws an error: Object(...) is not a function

Intended outcome:

I migrate a project from apollo-client v2 to v3. Once the configuration updated, ApolloClient with InMemoryCache should not throw any error.

Actual outcome:

Making requests with ApolloClient and InMemoryCache throws errors. This is because of addTypename set to true.

| TypeError: Object(...) is not a function
|     at Object.enter (webpack:///./node_modules/@apollo/client/utilities/graphql/transform.js?:142:219)
|     at visit (webpack:///./node_modules/graphql/language/visitor.js?:261:26)
|     at addTypenameToDocument (webpack:///./node_modules/@apollo/client/utilities/graphql/transform.js?:117:82)
|     at InMemoryCache.transformDocument (webpack:///./node_modules/@apollo/client/cache/inmemory/inMemoryCache.js?:223:119)
|     at QueryManager.transform (webpack:///./node_modules/@apollo/client/core/QueryManager.js?:257:42)
|     at QueryManager.fetchQueryObservable (webpack:///./node_modules/@apollo/client/core/QueryManager.js?:520:26)
|     at QueryManager.fetchQuery (webpack:///./node_modules/@apollo/client/core/QueryManager.js?:237:21)
|     at QueryManager.query (webpack:///./node_modules/@apollo/client/core/QueryManager.js?:308:21)
|     at ApolloClient.query (webpack:///./node_modules/@apollo/client/ApolloClient.js?:134:34)
|     at http__WEBPACK_IMPORTED_MODULE_3___default.a.createServer.Object (webpack:///./src/server/server.js?:225:24)

How to reproduce the issue:

I’m using super default configuration of ApolloClient:

const client = new ApolloClient({
    link: from([
        new HttpLink({ uri }),
    ]),
    cache: new InMemoryCache(),
});

So any request that I do - throws this error. When I disable addTypename for InMemoryCache I have same error Object(...) is not a function with second query while merging fields:

| TypeError: Object(...) is not a function
|     at eval (webpack:///./node_modules/@apollo/client/utilities/common/mergeDeep.js?:51:128)
|     at Array.forEach (<anonymous>)
|     at DeepMerger.merge (webpack:///./node_modules/@apollo/client/utilities/common/mergeDeep.js?:47:33)
|     at Root.EntityStore.merge (webpack:///./node_modules/@apollo/client/cache/inmemory/entityStore.js?:87:123)
|     at StoreWriter.processSelectionSet (webpack:///./node_modules/@apollo/client/cache/inmemory/writeToStore.js?:135:27)
|     at StoreWriter.writeToStore (webpack:///./node_modules/@apollo/client/cache/inmemory/writeToStore.js?:32:29)
|     at InMemoryCache.write (webpack:///./node_modules/@apollo/client/cache/inmemory/inMemoryCache.js?:97:37)
|     at InMemoryCache.ApolloCache.writeQuery (webpack:///./node_modules/@apollo/client/cache/core/cache.js?:49:21)
|     at eval (webpack:///./node_modules/@apollo/client/core/QueryInfo.js?:154:31)
|     at perform (webpack:///./node_modules/@apollo/client/cache/inmemory/inMemoryCache.js?:200:17)

NOTE: ApolloClient v2 with such configuration work nice, without any errors.

Versions "@apollo/client": "3.0.0" and higher. Also I tried changing graphql package versions from 14.0.0 to the highest one - errors still present.

About this issue

Original URL
State: closed
Created 4 years ago
Reactions: 5
Comments: 19 (6 by maintainers)

Most upvoted comments

we’ve had this issue trying to upgrade from 3.2.x to 3.3.x. i’ve confirmed (by locking Yarn package resolution to an explicit version) that the issue starts on 3.3.0

as @beedaan suggested, manually installing the ts-invariant package seems to fix the issue… but it’s not at all clear why this would be the case

chrisbutler on May 4, 2021

I had to install ts-invariant. I’m using @apollo/client 3.3.11

moose-byte on Feb 18, 2021

Also, we don’t use TypeScript in our project, so we don’t even have tslib dependency, but it’s version is required to be higher that 1.10.0 for @apollo/client?

Yep, and it should be installed automatically along with @apollo/client (so you don’t have to install it yourself), but sometimes a package-lock.json file can hold back the versions of some dependencies (at least that’s my guess here).

benjamn on Aug 11, 2020

Also, we don’t use TypeScript in our project, so we don’t even have tslib dependency, but it’s version is required to be higher that 1.10.0 for @apollo/client?

Yep, and it should be installed automatically along with @apollo/client (so you don’t have to install it yourself), but sometimes a package-lock.json file can hold back the versions of some dependencies (at least that’s my guess here).

When merging I had to redo my package-lock file otherwise I run into similar problems. I was a bit painful as I had to update other packages and make everything work together again.

tyagow on Aug 13, 2020

Thank you so much, installing tslib@1.13.0 fixed the problem.

And I agree with you that tracing such problems does not have to take hours, but I don’t have a lot of experience of debugging libraries code. And it was a little big harder because of webpack 😃

But it was nice experience and it would help me in my future work.

Also, we don’t use TypeScript in our project, so we don’t even have tslib dependency, but it’s version is required to be higher that 1.10.0 for @apollo/client?

himiranov on Aug 11, 2020