ApolloClient createHttpLink 打字稿错误 2739

ApolloClient createHttpLink typescript error 2739

我正在创建我的 React 前端,使用 apollo 客户端连接到我的 apollo 服务器:

App.tsx

import React from "react";
import "./app.scss";

import {
  ApolloLink,
  ApolloClient,
  ApolloProvider,
  InMemoryCache,
} from "@apollo/client";
import { createHttpLink } from "apollo-link-http";

function App() {
  const client = new ApolloClient({
    **link**: createHttpLink({
      uri: "http://localhost:4000/graphql",
      credentials: "include",
    }),
    cache: new InMemoryCache(),
  });
  return (
    <ApolloProvider client={client}>
      <div className="App">
        <h1>Hello there</h1>
      </div>
    </ApolloProvider>
  );
}

export default App;

顺便说一句,我正在使用打字稿。

出于某种原因,我遇到了打字稿错误。当我将鼠标悬停在 ApolloClient 配置中的 link 参数上时,它会显示:

Type 'ApolloLink' is missing the following properties from type 'ApolloLink': onError, setOnError ts(2739)

ApolloClient.d.ts(20, 5): 

The expected type comes from property 'link' which is declared here on type 'ApolloClientOptions<NormalizedCacheObject>'

您可以使用 HttpLink of @apollo/client package. apollo-link-http package is included in @apollo/client package, see Migrate to Apollo client v3

All apollo-link, apollo-link-http, and apollo-link-http-common functionality is included in the @apollo/client package.

As part of migrating, we recommend removing all apollo-link, apollo-link-http, and apollo-link-http-common dependencies.

import React from 'react';
import { ApolloClient, ApolloProvider, InMemoryCache, HttpLink } from '@apollo/client';

function App() {
  const client = new ApolloClient({
    link: new HttpLink({
      uri: 'http://localhost:4000/graphql',
      credentials: 'include',
    }),
    cache: new InMemoryCache(),
  });
  return (
    <ApolloProvider client={client}>
      <div className="App">
        <h1>Hello there</h1>
      </div>
    </ApolloProvider>
  );
}

export default App;

包版本:"@apollo/client": "^3.4.7"