Apollo graphql 可以与 Nextjs 一起使用而无需安装 react-router-dom 吗？

如何解决Apollo graphql 可以与 Nextjs 一起使用而无需安装 react-router-dom 吗？

ApolloProvider 包装应用程序：

<ApolloProvider client={client}>
    <App />
</ApolloProvider>

问题是，在 nextjs 中，您可以在 pages 文件夹中声明路由组件，而无需将它们添加到 App.js

这会导致错误“不变违规：在上下文中找不到“客户端”或作为选项传入。“

可以在这些组件中使用原生 Nextjs 处理路由的方式使用 Apollo 吗？

解决方法

这就是我对我的所做的，创建一个单独的文件夹，我称之为 apollo 文件夹，就像这样：

然后在该文件夹中创建一个文件名，无论您想要什么，然后为您的阿波罗客户端放置此代码或任何代码

apollo/ apolloClient.js

 import ApolloClient from "apollo-client";
    import { InMemoryCache } from "apollo-cache-inmemory";
    import { createHttpLink } from "apollo-link-http";
    import { ApolloProvider } from "@apollo/react-hooks";
    import { setContext } from "apollo-link-context";
    
    const httpLink = createHttpLink({
      uri: "http://localhost:5000",});
    
    const authLink = setContext(() => {
      const token = localStorage.getItem("jwtToken");
      return {
        headers: {
          Authorization: token ? `Bearer ${token}` : "",},};
    });
    
    const client = new ApolloClient({
      link: authLink.concat(httpLink),cache: new InMemoryCache(),});
    
    export default client;

您必须导出客户端或我对我的客户端所做的事情，然后转到 _app.js：

import "../styles/globals.css";
import { ApolloProvider } from "@apollo/react-hooks";
import client from "../apollo/apolloClient";

function MyApp({ Component,pageProps }) {
  return (
    <ApolloProvider client={client}>
          <Component {...pageProps} />
    </ApolloProvider>
  );
}

export default MyApp;

我们已经从刚刚创建的 apolloClient.js 文件中导入了客户端并导出了客户端

希望这就是你的意思。