Gatsby электронной коммерции startkit + проблема с графиком GraphQL - PullRequest
Новая
       18

Gatsby электронной коммерции startkit + проблема с графиком GraphQL

1 голос
/ 05 июля 2019

Я родом из React, Mongo, узла, немного SQL и Shopify (тонны JS под моим поясом).

Я наткнулся на эту идею стека JAM, и она показалась мне интересной, и решил попробовать.Я сталкиваюсь с этой проблемой, которая, честно говоря, я, кажется, не могу обернуть голову после всего того, что я видел в GraphQL и статей, которые я читаю, я явно упускаю что-то важное.

Традиционно в бэкэнде REST вы разрабатываете схему и свои конечные точки, а затем запрашиваете у них данные.

После этого вступления я перехожу к той части, где я запрашиваю GraphQL, но не могу понять, что или как я запрашиваю, без разработки схемы.Используйте этот код (после настройки Strip с тестовым продуктом / ключом) 

import React from "react"
import { graphql, StaticQuery } from "gatsby"

export default props => (
  <StaticQuery
    query={graphql`
      query SkusForProduct {
        skus: allStripeSku {
          edges {
            node {
              id
              currency
              price
              attributes {
                name
              }
            }
          }
        }
      }
    `}
    render={({ skus }) => (
      <div>
        {skus.edges.map(({ node: sku }) => (
          <p key={sku.id}>{sku.attributes.name}</p>
        ))}
      </div>
    )}
  />
)

В нем говорится:

Вы можете проверить свой запрос и посмотреть, какие данные возвращаются в GraphiQL,который доступен в http://localhost:8000/___graphql при запуске npm run.

Посетив эту область, я заметил настройки и параметры Query.Это где я разрабатываю запрос, который я использую (или схему?)

Немного потерян из-за того, на что похож этот тип «соединения».

После завершения полного урока и замены ключей API я получаю эту ошибку: 

GraphQL Error Encountered 1 error(s):
- Unknown field 'allStripeSku' on type 'Query'.

      file: /Users/robert/Software/bDev/evu/src/components/products/skus.js

Мой gatsby-config: 

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-stripe`,
    {
      resolve: `gatsby-source-stripe`,
      options: {
        objects: ["Sku"],
        secretKey: process.env.STRIPE_SECRET_KEY,
        downloadFiles: true,
      },
    },
    `gatsby-plugin-sharp`,
    {
      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`,
  ],

}
...