使用 typescript + 生成的核心用作 package 调用 graphql-codegen 查询时，挂钩调用无效

Question

我正在使用带有生成代码的 npm package 和使用它的移动 package 的 Yarn 工作区。

尝试从导入的查询中拨打电话时，我收到无效的挂钩调用。 在该组件中使用任何其他钩子（即 useState）都可以正常工作。

我的手机 package 的 package.json 导入： "@workspace-library/core": "1.0.0",

我在 core/src 有一个 index.js 文件，它有：

export * from "./generated/graphql";
export { apollo, useAuth, withAuth };

我像这样导入查询：

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>
  );
};

我可以在生成的/graphql.jsx 中看到 useArticlesQuery，以防万一：

export function useArticlesQuery(baseOptions) { return ApolloReactHooks.useQuery(ArticlesDocument, baseOptions); }

环境：

• 操作系统：Ubuntu
• "@graphql-codegen/cli": "^1.13.1",
• "@graphql-codegen/typescript": "^1.13.1",
• "@graphql-codegen/typescript-operations": "^1.13.1",
• "@graphql-codegen/typescript-react-apollo": "^1.13.1",
• 纱线工作区

有问题的附加上下文错误：

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

Answer 1

我遇到了同样的问题。 使用useQuery是有效的。