4
votes

Violation invariante GatsbyJS: une erreur s'est produite lors de la tentative d'inférence d'un type GraphQL

Liens utiles:

Récemment, Shopify a publié un moyen de récupérer des méta-champs avec l'API Storefront . Afin d'obtenir un accès en lecture aux méta-champs à partir de l' API Shopify GraphQL Storefront, nous devons ajouter les méta-champs à la liste blanche de l' API Admin de Shopify GraphQL .

J'ai créé 2 plugins locaux:

  1. gatsby-source-shopify-metafields qui utilise graphql-request pour updateMetafieldStorefrontVisibility à updateMetafieldStorefrontVisibility du métafield exact sur un produit. Pour exécuter la mutation updateMetafieldStorefrontVisibility faites cd plugins/gatsby-source-shopify-metafields && node lib.js
  2. gatsby-source-shopify est une version mise à jour du default gatsby-source-shopify avec les queries.js , nodes.js et gatsby-node.js pour inclure le champ de metafields nouvellement disponible.

Après avoir exécuté updateMetafieldStorefrontVisibility j'ai pu interroger les métafields du produit à l'aide de curl :

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`,
  ],
}

Réponse: {"data":{"productByHandle":{"metafield":{"value":"true"}}}}

Pour reproduire l'erreur, veuillez cloner ce dépôt

Sur gatsby develop j'obtiens une Invariant Violation: Encountered an error trying to infer a GraphQL type erreur de 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

Environnement

  • gatsby v2.5.2
  • nœud v11.14.0

Contenu du fichier

gatsby-config.js :

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
    }
  }
}
'

Je m'attends à obtenir une construction propre, à la place, j'obtiens une Invariant Violation: Encountered an error trying to infer a GraphQL type


1 commentaires

C'est un message d'erreur assez courant que j'ai vu lors de l'utilisation d'autres plugins de point de terminaison GraphQL avec Gatsby, par exemple. le avec WordPress. Habituellement, cela signifie que vous obtenez quelque chose comme false de l'API lorsque vous avez réellement besoin de null , et / ou que vous avez construit le site Gatsby dans un environnement qui supposait qu'une sorte de données serait présente et maintenant sur un nouveau site Shopify que les données ne sont pas pas encore là. Dans ce cas, peut-être pas encore «Shopify__ProductMetafields»? Que voyez-vous dans l'interface GraphiQL? ( localhost: 8000 / ___ graphql )


3 Réponses :


5
votes

Exécutez gatsby clean . Il s'agit d'une erreur de référence de nœud dans un fichier mis en cache.


0 commentaires

-2
votes

lancez simplement "gatsby clean" pour supprimer le fichier cache


0 commentaires

1
votes

J'ai eu ce problème: entrez la description de l'image ici

Pour le résoudre, j'ai npm install gatsby-source-shopify


0 commentaires