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

Question

有用的链接：

• 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 个本地插件：

1. gatsby-source-shopify-metafields 使用产品上确切元字段的 graphql-request 到 updateMetafieldStorefrontVisibility。要运行updateMetafieldStorefrontVisibility 突变，请执行cd plugins/gatsby-source-shopify-metafields && node lib.js。
2. 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

Answer 1

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

Answer 2

我遇到了这个问题：

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

Answer 3

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