我正在使用React,Apollo和Next.js构建一个项目。我正在尝试将react-apollo更新为3.1.3,现在在查看站点时遇到以下错误。
不变违规:在上下文中找不到“客户端”或作为选项传递。将根组件包装在中,或通过options传递ApolloClient实例。
如果我将react-apollo软件包降级到2.5.8,它可以正常工作,所以我认为在2.5和3.x之间已经有所变化,但是在react-apollo或next-with-apollo文档中找不到任何内容来指示那可能是什么。任何帮助将不胜感激。
withData.js
import withApollo from 'next-with-apollo';
import ApolloClient from 'apollo-boost';
import { endpoint } from '../config';
function createClient({ headers }) {
return new ApolloClient({
uri: endpoint,
request: operation => {
operation.setContext({
fetchOptions: {
credentials: 'include'
},
headers
});
},
// local data
clientState: {
resolvers: {
Mutation: {}
},
defaults: {}
}
});
}
export default withApollo(createClient);
_app.js
import App from 'next/app';
import { ApolloProvider } from 'react-apollo';
import Page from '../components/Page';
import { Overlay } from '../components/styles/Overlay';
import withData from '../lib/withData';
class MyApp extends App {
static async getInitialProps({ Component, ctx }) {
let pageProps = {};
if (Component.getInitialProps) {
pageProps = await Component.getInitialProps(ctx);
}
// this exposes the query to the user
pageProps.query = ctx.query;
return { pageProps };
}
render() {
const { Component, apollo, pageProps } = this.props;
return (
<ApolloProvider client={apollo}>
<Overlay id="page-overlay" />
<Page>
<Component {...pageProps} />
</Page>
</ApolloProvider>
);
}
}
export default withData(MyApp);
就我而言,我发现我已经[email protected]
安装了以及@apollo/[email protected]
。删除@apollo/react-hooks
并仅依靠它react-apollo
为我解决了不变性问题。确保您的锁定文件中没有使用任何不匹配的版本,或者package.json
这就是某人在GitHub问题线程中所说的,我也是如此。确保尝试一下!
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句