Question

我可以在开发模式下成功运行应用程序，但是每当尝试构建该应用程序时，我都会得到一个

10 |     function InvariantError(message) {
11 |         if (message === void 0) { message = genericMessage; }
> 12 |         var _this = _super.call(this, typeof message === "number"
 | ^
13 |             ? genericMessage + ": " + message + " (see 
https://github.com/apollographql/invariant-packages)"
14 |             : message) || this;
15 |         _this.framesToPop = 1;


WebpackError: Invariant Violation: Invariant Violation: 46 (see 
https://github.com/apollographql/invariant-packages)

- invariant.esm.js:12 new InvariantError
node_modules/ts-invariant/lib/invariant.esm.js:12:1

invariant.esm.js：24个不变 node_modules / ts-invariant / lib / invariant.esm.js：24：1
OperationData.js：30 MutationData ../ node_modules/@apollo/client/react/data/OperationData.js.OperationData.refreshClient node_modules/@apollo/client/react/data/OperationData.js：30：58
MutationData.js：38 MutationData ../ node_modules/@apollo/client/react/data/MutationData.js.MutationData.execute node_modules/@apollo/client/react/data/MutationData.js：38：45
useMutation.js：27 useMutation node_modules/@apollo/client/react/hooks/useMutation.js：27：1
ConfirmationButton.js：32 ConfirmationButton src / components / ConfirmationButton.js：32：44

错误命令失败，退出代码为1。

我目前已将组件包装在gatsby浏览器文件中的apollo提供程序中。

任何帮助将不胜感激。

Answer 1

您需要在gatsby ssr和浏览器中向Apollo客户端添加同构提取。

Answer 2

gatsby-plugin-apollo帮了我大忙：npm install gatsby-plugin-apollo @apollo/client。

// gatsby-config.js
module.exports = {
  plugins: [
    {
      resolve: 'gatsby-plugin-apollo',
      options: {
        uri: 'https://example.com/graphql'
      }
    }
  ]
};

https://www.gatsbyjs.com/plugins/gatsby-plugin-apollo/#gatsby-plugin-apollo

Apollo 3 useQuery＆useMutation导致Gatsby Build崩溃

2 个答案: