GatsbyJS Invariant Violation：在尝试推断 GraphQL 类型时遇到错误

Posted 2023-03-08

技术标签:

【中文标题】GatsbyJS Invariant Violation：在尝试推断 GraphQL 类型时遇到错误【英文标题】：GatsbyJS Invariant Violation: Encountered an error trying to infer a GraphQL type 【发布时间】：2019-10-07 04:06:50 【问题描述】：

有用的链接：

Retrieving metafields with the Storefront API Shopify GraphQL Admin API Shopify GraphQL Storefront API

最近 Shopify 发布了retrieving metafields with the Storefront API 的方法。为了获得对来自Shopify GraphQL Storefront API 的元字段的读取访问权限，我们必须将来自Shopify GraphQL Admin API 的元字段列入白名单。

我创建了 2 个本地插件：

gatsby-source-shopify-metafields

graphql-request

updateMetafieldStorefrontVisibility

cd plugins/gatsby-source-shopify-metafields && node lib.js

gatsby-source-shopify

default gatsby-source-shopify

queries.js

nodes.js

gatsby-node.js

metafields

运行updateMetafieldStorefrontVisibility 后，我能够使用curl 查询产品元字段：

curl -X POST \
"https://shop-name.myshopify.com/api/graphql.json" \
-H "Content-Type: application/graphql" \
-H "X-Shopify-Storefront-Access-Token: XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX" \
-d '
query 
  productByHandle(handle: "nike-air-max-720") 
    metafield(namespace: "global", key: "free_shipping") 
      value
    
  

'

回复："data":"productByHandle":"metafield":"value":"true"

要重现错误，请克隆 this repo

在gatsby develop 我得到Invariant Violation: Encountered an error trying to infer a GraphQL type 错误：

gatsby develop
success open and validate gatsby-configs — 0.004 s
success load plugins — 0.368 s
success onPreInit — 0.006 s
success initialize cache — 0.094 s
success copy gatsby files — 0.045 s
success onPreBootstrap — 0.006 s

gatsby-source-shopify/new-dev-sandbox starting to fetch data from Shopify

gatsby-source-shopify/new-dev-sandbox fetched and processed blogs: 274.471ms

gatsby-source-shopify/new-dev-sandbox fetched and processed policies: 278.416ms

gatsby-source-shopify/new-dev-sandbox fetched and processed productTypes: 406.051ms

gatsby-source-shopify/new-dev-sandbox fetched and processed articles: 641.547ms

gatsby-source-shopify/new-dev-sandbox fetched and processed collections: 754.319ms


gatsby-source-shopify/new-dev-sandbox fetched and processed products: 1832.663ms

gatsby-source-shopify/new-dev-sandbox finished fetching data from Shopify: 1848.663ms
success source and transform nodes — 1.903 s
warning Multiple node fields resolve to the same GraphQL field `ShopifyCollection.products` - [`products`, `products___NODE`]. Gatsby will use `products___NODE`.
warning Multiple node fields resolve to the same GraphQL field `ShopifyProduct.metafields` - [`metafields`, `metafields___NODE`]. Gatsby will use `metafields___NODE`.
error UNHANDLED REJECTION


  Error: Invariant Violation: Encountered an error trying to infer a GraphQL type for: `metafields___  NODE`. There is no corresponding node with the `id` field matching: "Shopify__ProductMetafield__und  efined,Shopify__ProductMetafield__undefined,Shopify__ProductMetafield__undefined,Shopify__ProductMe  tafield__undefined".

  - invariant.js:40 invariant
    [gatsby-shopify-invariant-violation-example]/[invariant]/invariant.js:40:15

  - add-inferred-fields.js:259 getFieldConfigFromFieldNameConvention
    [gatsby-shopify-invariant-violation-example]/[gatsby]/dist/schema/infer/add-inferred-fields.js:25    9:3

  - add-inferred-fields.js:161 getFieldConfig
    [gatsby-shopify-invariant-violation-example]/[gatsby]/dist/schema/infer/add-inferred-fields.js:16    1:19

  - add-inferred-fields.js:87 Object.keys.forEach.key
    [gatsby-shopify-invariant-violation-example]/[gatsby]/dist/schema/infer/add-inferred-fields.js:87    :25

  - Array.forEach

  - add-inferred-fields.js:74 addInferredFieldsImpl
    [gatsby-shopify-invariant-violation-example]/[gatsby]/dist/schema/infer/add-inferred-fields.js:74    :28

  - add-inferred-fields.js:38 addInferredFields
    [gatsby-shopify-invariant-violation-example]/[gatsby]/dist/schema/infer/add-inferred-fields.js:38    :3

  - index.js:98 addInferredType
    [gatsby-shopify-invariant-violation-example]/[gatsby]/dist/schema/infer/index.js:98:3

  - index.js:64 typesToInfer.map.typeComposer
    [gatsby-shopify-invariant-violation-example]/[gatsby]/dist/schema/infer/index.js:64:43

  - Array.map

  - index.js:64 addInferredTypes
    [gatsby-shopify-invariant-violation-example]/[gatsby]/dist/schema/infer/index.js:64:23

  - schema.js:140
    [gatsby-shopify-invariant-violation-example]/[gatsby]/dist/schema/schema.js:140:11

  - Generator.next

环境

盖茨比v2.5.2 节点v11.14.0

文件内容

gatsby-config.js：

require('dotenv').config(
  path: `.env.$process.env.NODE_ENV`
);

module.exports = 
  siteMetadata: 
    title: `Gatsby Default Starter`,
    description: `Kick off your next, great Gatsby project with this default starter. This barebones starter ships with the main Gatsby configuration files you might need.`,
    author: `@gatsbyjs`,
  ,
  plugins: [
    `gatsby-plugin-react-helmet`,
    
      resolve: `gatsby-source-filesystem`,
      options: 
        name: `images`,
        path: `$__dirname/src/images`,
      ,
    ,
    `gatsby-transformer-sharp`,
    `gatsby-plugin-sharp`,
    
      resolve: 'gatsby-source-shopify',
      options: 
        shopName: `$process.env.SHOPIFY_SHOP_NAME`,
        accessToken: `$process.env.SHOPIFY_STOREFRONT_ACCESS_TOKEN`,
        verbose: true
      
    ,
    
      resolve: `gatsby-plugin-manifest`,
      options: 
        name: `gatsby-starter-default`,
        short_name: `starter`,
        start_url: `/`,
        background_color: `#663399`,
        theme_color: `#663399`,
        display: `minimal-ui`,
        icon: `src/images/gatsby-icon.png`, // This path is relative to the root of the site.
      ,
    ,
    // this (optional) plugin enables Progressive Web App + Offline functionality
    // To learn more, visit: https://gatsby.dev/offline
    // `gatsby-plugin-offline`,
  ],

我希望得到干净的构建，相反，我得到了Invariant Violation: Encountered an error trying to infer a GraphQL type

【问题讨论】：

这是我在 Gatsby 中使用其他 GraphQL 端点插件时看到的非常常见的错误消息，例如。与 WordPress。通常这意味着当您实际需要 null 时，您会从 API 返回类似 false 的内容，和/或您在假设存在某种数据的环境中构建了 Gatsby 站点，并且现在在新的 Shopify 上数据还没有的网站。在这种情况下，可能还没有“Shopify__ProductMetafields”？您在 GraphiQL 界面中看到了什么？ (localhost:8000/___graphql) 【参考方案1】：

运行gatsby clean。这是缓存文件中的节点引用错误。

【讨论】：

【参考方案2】：

我遇到了这个问题：

为了解决它，我做了npm install gatsby-source-shopify

【讨论】：

【参考方案3】：

只需运行“gatsby clean”即可删除缓存文件

【讨论】：

删除.cache 文件夹为我解决了这个问题。但我们不想在每次构建时都删除 .cache？

以上是关于GatsbyJS Invariant Violation：在尝试推断 GraphQL 类型时遇到错误的主要内容，如果未能解决你的问题，请参考以下文章

将 Apollo Angular 2 用于 Angular ts-invariant/lib/invariant.d.ts:7:78 时出错