通过Gatsy-Source-GraphQL获取TypeError

时间:2019-07-31 06:18:35

标签: graphql gatsby

我重新安装了Gatsby,而且所做的唯一更改是安装了gatsby-source-graphql插件。然后,我将gatsby-config文件配置如下:

    {
      resolve: `gatsby-source-graphql`,
      options: {
        typeName: 'WORDPRESS',
        fieldName: 'wordpress',
        url: 'http://wordpress-285784-939255.cloudwaysapps.com/graphql',
        refetchInterval: 60,
      },
    },

然后,我创建了以下组件:

import React from 'react'
import { graphql, useStaticQuery } from 'gatsby'


export const HomeList = () => {

  const data = useStaticQuery(graphql`
    query featuredArticleQuery {
      wordpress {
        articles(where: {orderby: {field: DATE, order: DESC}}) {
          edges {
            node {
              date
              articleContent {
                articleTitle
                articleExcerpt
                articleContent
              }
              articleMeta {
                articleFeatured
              }
            }
          }
        }
      }
    }
  `)

  const articles = data.wordpress.articles.edges

  const latestArticles = articles.slice(3)

  const featuredArticles = articles.filter(
    article => article.node.articleMeta.articleFeatured === true
  )

  console.log('Articles: ', articles);
  return (
    <>
      <h2>Latest Articles</h2>
      {latestArticles.map(article => (
        <div>
          <h4>{article.node.articleContent.articleTitle}</h4>
          <p>{article.node.articleContent.articleExcerpt}</p>
        </div>
      ))}

      <h2>Recent Articles</h2>
      {featuredArticles.map(article => (
        <div>
          <h4>{article.node.articleContent.articleTitle}</h4>
          <p>{article.node.articleContent.articleExcerpt}</p>
        </div>
      ))}
    </>
  )
}

然后我将行articles {更改为此:

articles(where: {orderby: {field: DATE, order: DESC}}) {

现在,此更新的查询在graphiql中工作正常,但是当我在gatsby中运行它时,出现以下错误:

success update schema - 0.422 s
⠼ extract queries from components


  TypeError: Cannot read property 'length' of undefined

  - levenshtein.js:30 Object.get
    [test-ys]/[fast-levenshtein]/levenshtein.js:30:26

  - query-compiler.js:283 fragments.map.f
    [test-ys]/[gatsby]/dist/query/query-compiler.js:283:32

  - Array.map

  - query-compiler.js:280 compilerContext.documents.forEach.node
    [test-ys]/[gatsby]/dist/query/query-compiler.js:280:68

  - Array.forEach

  - query-compiler.js:246 Runner.write
    [test-ys]/[gatsby]/dist/query/query-compiler.js:246:33

  - query-compiler.js:104 Runner.compileAll
    [test-ys]/[gatsby]/dist/query/query-compiler.js:104:23


⠼ extract queries from components

有什么想法为什么会发生这种情况以及如何解决?

0 个答案:

没有答案