apollo-link-error: Type 'ApolloLink' is not assignable to type 'ApolloLink'. Two different types with this name exist, but they are unrelated.

Created on 7 Mar 2018  ·  27Comments  ·  Source: apollographql/apollo-link

Expected Behavior

Type of ApolloLink created by apollo-link-error onError shoud match ApolloLink used by apollo-link-http and apollo-client.

Actual Behavior

There seem to be two incompatible ApolloLink types in the result apollo-link-* packages.

The example below returns TypeScript errors on marked places, but works as expected when adding as any on marked places.

A _simple_ reproduction

import { InMemoryCache } from 'apollo-cache-inmemory'
import ApolloClient from 'apollo-client'
import { ApolloLink } from 'apollo-link'
import { onError } from 'apollo-link-error'
import { createHttpLink } from 'apollo-link-http'

const httpLink = createHttpLink({ uri: apiUrl })

const authLink = new ApolloLink((operation, forward) => {
  const token = getToken()
  if (token) {
    operation.setContext({
      headers: {
        Authorization: `Bearer ${token}`,
      },
    })
  }
  return forward(operation)
})

const logLink = onError(error => console.error('Apollo Error', error))  // as any

const link = logLink.concat(authLink.concat(httpLink))  // as any

/*
TS2345: Argument of type 'ApolloLink' is not assignable to parameter of type 'ApolloLink | RequestHandler'.
  Type 'ApolloLink' is not assignable to type 'RequestHandler'.
    Type 'ApolloLink' provides no match for the signature '(operation: Operation, forward?: NextLink): Observable<FetchResult<Record<string, any>, Record<string, any>>>'.
*/

export const graphql = new ApolloClient({
  cache: new InMemoryCache(),
  link,
})

/*
TS2345: Argument of type '{ cache: InMemoryCache; link: ApolloLink; }' is not assignable to parameter of type 'ApolloClientOptions<NormalizedCacheObject>'.
  Types of property 'link' are incompatible.
    Type 'ApolloLink' is not assignable to type 'ApolloLink'. Two different types with this name exist, but they are unrelated.
      Types of property 'split' are incompatible.
        Type '(test: (op: Operation) => boolean, left: ApolloLink | RequestHandler, right?: ApolloLink | Reques...' is not assignable to type '(test: (op: Operation) => boolean, left: ApolloLink | RequestHandler, right?: ApolloLink | Reques...'. Two different types with this name exist, but they are unrelated.
          Types of parameters 'left' and 'left' are incompatible.
            Type 'ApolloLink | RequestHandler' is not assignable to type 'ApolloLink | RequestHandler'. Two different types with this name exist, but they are unrelated.
              Type 'ApolloLink' is not assignable to type 'ApolloLink | RequestHandler'.
                Type 'ApolloLink' is not assignable to type 'RequestHandler'.

*/

Issue Labels

  • [x] has-reproduction
  • [ ] feature
  • [ ] blocking
  • [ ] good first issue
has-reproduction

Most helpful comment

I'm seeing this issue as well.

All 27 comments

I'm seeing this issue as well.

Same here...

@iki Interesting, thank you for opening the issue! Have you updated the apollo-link-error and apolo-link-http to the latest version? If you run 'npm run compile' in https://github.com/evans/apollo-link-reproductions/tree/538, I don't see any type errors. The types should work, since the duck typing of ApolloLink should be identical. Do you have a reproduction repository I could clone? We may have to declare a minimum version of TS?

I had this issue, and appear to have resolved it by fixing the version of apollo-link in package.json as follows:

{
    "dependencies": {
       "dependencies": {
        "apollo-cache-inmemory": "^1.1.12",
        "apollo-client": "^2.2.8",
        "apollo-codegen": "^0.19.0",
        "apollo-link": "^1.2.1",
        "apollo-link-batch-http": "^1.2.1",
        "apollo-link-http": "^1.5.3",
        "apollo-link-retry": "^2.2.2"
    },
    "resolutions": {
        "apollo-link": "1.2.1"
    }
}

I've had to do a similar thing with graphql to ensure only one copy of it exists.

This should be fixed in the most recent release. See #599, which was closed by #600 and released in [email protected]

@evans I'm still waiting for [email protected] to be released so we get the fixes for this issue. It's holding me back from upgrading the other apollo packages.

Same here, waiting on 1.0.10 publish

@ravishivt @sccdGyan Sorry about that! I'm not sure what happened there. Things should be sorted out in [email protected]

I have a similar problem:

Relevant dependecies:

"dependencies": {
    "@apollo/client": "^3.0.0-beta.19",
    "apollo-link-ws": "^1.0.19",
    "graphql": "^14.5.8",
    "subscriptions-transport-ws": "^0.9.16",
    ...
  },

Code:

import {
    ApolloClient,
    InMemoryCache,
    HttpLink,
    ApolloLink,
    Operation,
    NextLink,
    split,
    getMainDefinition
} from '@apollo/client'
import { WebSocketLink } from 'apollo-link-ws';

const wsLink = new WebSocketLink({
    uri: config.backendWSApiUrl,
    options: {
        reconnect: true
    }
})

const httpLink = new HttpLink({
    uri: config.backendHttpApiUrl
})

const link = split(
    // split based on operation type
    ({ query }) => {
        const definition = getMainDefinition(query);
        return (
            definition.kind === 'OperationDefinition' &&
            definition.operation === 'subscription'
        );
    },
    wsLink,
    httpLink,
);


Typescript error:

Argument of type 'WebSocketLink' is not assignable to parameter of type 'ApolloLink | RequestHandler'.
  Type 'WebSocketLink' is missing the following properties from type 'ApolloLink': onError, setOnErrorts(2345)

Same as @mnesarco with the 3.0 beta

I'm encountering the same with
"@apollo/client": "~3.0.0-beta.29 and "@apollo/link-error": "^2.0.0-beta.3",
using ApolloLink.from([errorLink, httpLink])

@smeevil did you find any fix on this, I am also facing the same

nope

Should this be reopend?

Updating latest Apollo client 3.0.0 beta 32 version solved the problem for me

Updating to [email protected] from 1.1.12 worked for me.

All good for me now using

"@apollo/client": "^3.0.0-beta.37",
"@apollo/link-context": "^2.0.0-beta.3",
"@apollo/link-error": "^2.0.0-beta.3",
"@apollo/link-retry": "^2.0.0-beta.3",
"@apollo/link-ws": "^2.0.0-beta.3",`

All good for me now using

"@apollo/client": "^3.0.0-beta.37",
"@apollo/link-context": "^2.0.0-beta.3",
"@apollo/link-error": "^2.0.0-beta.3",
"@apollo/link-retry": "^2.0.0-beta.3",
"@apollo/link-ws": "^2.0.0-beta.3",`

Thanks! Updating @apollo/client to 3.0.0-beta.39 will cause this error.

Using @apollo/link-error instead of apollo-link-error worked for me.

I'm new to Apollo and I got this error by following the Apollo Server guide, which instructs you to import ApolloClient from apollo-boost without using the Apollo link libraries directly. My code looks like:

import ApolloClient from 'apollo-boost';

const client = new ApolloClient({
  uri: "/api/graphql",
});

const App = ({ Component, pageProps }: AppProps) => {
  return (
    <ApolloProvider client={client}>
      <Component {...pageProps} />
    </ApolloProvider>
  )
}

I was able to fix it by installing @apollo/client and refactoring to something like this:

import { ApolloClient, HttpLink, InMemoryStore } from '@apollo/client';

const client = new ApolloClient({
  cache: new InMemoryStore(),
  link: new HttpLink({ uri: "/api/graphql" })
});

const App = ({ Component, pageProps }: AppProps) => {
  return (
    <ApolloProvider client={client}>
      <Component {...pageProps} />
    </ApolloProvider>
  )
}

Thanks! Updating @apollo/client to 3.0.0-beta.39 will cause this error.

This seems to have been fixed by version @apollo/client to 3.0.0-beta.41, thankfully!

I had this problem today when I tried the new 3.0.0-beta.43.
Was able to resolve and sharing how in case it helps anyone else.

For me either specifying package.json "resolutions" field to beta.43 OR, alternatively, deleting yarn.lock and reinstalling sorted this out.

On 3.0.0-beta.44. Tried adding resolutions field in package.json and deleting yarn.lock file, neither has worked for me.

For me upgrading client and link-error fixed the problem:
"@apollo/client": "^3.0.0-beta.49", "@apollo/link-error": "^2.0.0-beta.3"

i'm on

    "@apollo/client": "^3.0.0-beta.50",
    "@apollo/link-context": "^2.0.0-beta.3",

and still have this issue.

i'm on

    "@apollo/client": "^3.0.0-beta.50",

    "@apollo/link-context": "^2.0.0-beta.3",

and still have this issue.

For my project, carefully reviewing package.json and making sure _all_ things Apollo are 3.0, then deleting yarn.lock and yarn installing again worked.

Thanks @onpaws . I guess my problem is that I do have other (dev) dependencies that themselves have "old" Apollo as dependencies (e.g. graphql-codegen), and I'm not up for removing those. But I don't _import_ the old ones in my code, so I don't understand why Typescript would be confused about them. I'm brand new to Typescript, though, so this is likely just a "me" problem. Everything runs fine if I just cast via as any, even though it looks ridiculous:

export const client = new ApolloClient({
  cache: new InMemoryCache(),
  link: authenLink.concat(httpLink as any) as any
});
Was this page helpful?
0 / 5 - 0 ratings