[英]Invalid hook calls when calling a graphql-codegen query with typescript + generated core used as a package
I'm using Yarn workspaces with a npm package having the generated code and a mobile package that uses it.我正在使用带有生成代码的 npm package 和使用它的移动 package 的 Yarn 工作区。
When trying to make a call from an imported query I get an invalid hook call.尝试从导入的查询中拨打电话时,我收到无效的挂钩调用。 Using any other hook in that component (ie useState) works fine.
在该组件中使用任何其他钩子(即 useState)都可以正常工作。
My package.json of my mobile package imports: "@workspace-library/core": "1.0.0",
我的手机 package 的 package.json 导入:
"@workspace-library/core": "1.0.0",
I have an index.js file at core/src that has:我在 core/src 有一个 index.js 文件,它有:
export * from "./generated/graphql";
export { apollo, useAuth, withAuth };
And I import the queries like this:我像这样导入查询:
import {
useArticlesQuery
} from "@workspace-library/core";
const SidebarArticles: FunctionComponent<{ props: any }> = (props: any) => {
const [test, setTest] = useState("false");
const data = useArticlesQuery({
fetchPolicy: "no-cache",
notifyOnNetworkStatusChange: true,
});
return (
<View>
<Text>Heyhey</Text>
</View>
);
};
I can see the useArticlesQuery in my generated/graphql.jsx, just in case:我可以在生成的/graphql.jsx 中看到 useArticlesQuery,以防万一:
export function useArticlesQuery(baseOptions) { return ApolloReactHooks.useQuery(ArticlesDocument, baseOptions); }
Environment:环境:
Additional context Error in question:有问题的附加上下文错误:
Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app
* /home/dogchef/Development/workspace-library/packages/core/node_modules/react/cjs/react.development.js:1589:4 in resolveDispatcher
* /home/dogchef/Development/workspace-library/packages/core/node_modules/react/cjs/react.development.js:1597:29 in useContext
* http://192.168.1.2:19001/node_modules/expo/AppEntry.bundle?platform=android&dev=true&minify=false&hot=false:181621:41 in useBaseQuery
* /home/dogchef/Development/workspace-library/packages/core/node_modules/@apollo/react-hooks/lib/react-hooks.cjs.js:550:18 in useQuery
* http://192.168.1.2:19001/node_modules/expo/AppEntry.bundle?platform=android&dev=true&minify=false&hot=false:197883:37 in useArticlesQuery
* components/SidebarArticles.tsx:10:2 in SidebarArticles
I run into the same issue.我遇到了同样的问题。 Using
useQuery
is working though.使用
useQuery
是有效的。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.