在 Gatsby-node.js 中检索多种数据类型时,graphql 重复文档错误

Posted

技术标签:

【中文标题】在 Gatsby-node.js 中检索多种数据类型时,graphql 重复文档错误【英文标题】:graphql duplicated documents error when retreiving multiple data types in Gatsby-node.js 【发布时间】:2019-07-19 02:01:44 【问题描述】:

我有一个简单的 Gatsby 原型,它使用 Kentico Cloud 作为数据源。对我来说幸运的是,他们已经构建了一个source plugin,我用它来获取一个名为“BlogPost”的数据类型。这按预期工作。

gatsby-node.js 源码

const path = require(`path`);

exports.createPages = (graphql, actions) => 
    const  createPage  = actions;
    return new Promise((resolve, reject) => 
        graphql(`
        
            allKenticoCloudItemBlogPost 
              edges 
                node 
                  elements 
                    url_slug
                      value
                    
                  
                
              
            
          
        `).then(result =>         
            console.log(result);
            result.data.allKenticoCloudItemBlogPost.edges.map((node) => 
                createPage(
                    path: `$node.elements.url_slug.value`,
                    component: path.resolve(`./src/templates/blog-post.js`),
                    context: 
                        slug: node.elements.url_slug.value,
                    ,
                )
            )
            resolve();
        )
    );


这很好用,但我真的想添加第二种数据类型,称为“文章”

按照Gatsby Kentico Starter Template Example,我修改了我的 gatsby-node.js 文件

const path = require(`path`);

exports.createPages = (graphql, actions) => 
    const  createPage  = actions;

    return new Promise((resolve, reject) => 
        graphql(`
        
          allKenticoCloudItemBlogPost 
            edges 
              node 
                elements 
                  url_slug
                    value
                  
                
              
            
          
          allKenticoCloudItemArticle
            edges
              node
                elements
                  url_slug
                    value
                   
                
                internal
                  type
                
              
            
          
        
        `).then(result => 
            console.log('START HERE');        
            console.log(JSON.stringify(result));
            result.data.allKenticoCloudItemBlogPost.edges.map((node) => 
              createPage(
                  path: `$node.elements.url_slug.value`,
                  component: path.resolve(`./src/templates/blog-post.js`),
                  context: 
                      slug: node.elements.url_slug.value,
                  ,
              )
            );
            result.data.allKenticoCloudItemArticle.edges.map((node) => 
              createPage(
                path: `$node.elements.url_slug.value`,
                component: path.resolve(`./src/templates/article.js`),
                context: 
                  slug: node.elements.url_slug.value,
                ,
              )
            )
            resolve();
        )
    );

如您所见,我记录了结果,以便查看它们的外观。

console.log(JSON.stringify(result));

生产


  "data": 
    "allKenticoCloudItemBlogPost": 
      "edges": [
        
          "node":  "elements":  "url_slug":  "value": "my-first-post"   
        ,
        
          "node": 
            "elements":  "url_slug":  "value": "my-second-blog-post"  
          
        ,
         "node":  "elements":  "url_slug":  "value": "3rd-blog-post"    
      ]
    ,
    "allKenticoCloudItemArticle": 
      "edges": [
        
          "node": 
            "elements":  "url_slug":  "value": "article-1-example"  ,
            "internal":  "type": "KenticoCloudItemArticle" 
          
        ,
        
          "node": 
            "elements":  "url_slug":  "value": "article-2"  ,
            "internal":  "type": "KenticoCloudItemArticle" 
          
        
      ]
    
  

到目前为止,一切都很好。我看到了我期望看到的。

当我运行 gatsby develop 时,它实际上编译成功,但出现了 graphQL 错误

错误 GraphQL 错误 编译您网站的 GraphQL 查询。错误:RelayParser:遇到重复 一个或多个文档的定义:每个文档必须有一个 唯一的名称。重复文件: - 模板生成器

我试图通过在我的第一个 BlogPost 查询后加一个逗号来解决这个问题。

graphql(`

  allKenticoCloudItemBlogPost 
    edges 
      node 
        elements 
          url_slug
            value
          
        
      
    
  ,
  allKenticoCloudItemArticle
    edges
      node
        elements
          url_slug
            value
           
        
        internal
          type
        
      
    
  

我尝试将新查询作为新承诺放入,但我的编辑器通知我这是无法访问的代码,所以我知道这不会起作用。

它必须很小,因为我在 Gatsby Kentico Source Plugin starter 之后建模了我的代码,它使用了与我相同的技术。我可以毫无问题地下载并运行该项目。所以我不确定我做错了什么。

编辑

我解决了这个问题。问题出在每种数据类型的模板中。我将这两个查询都命名为 templateBuilder。我将博客模板更改为 blogBu​​ilder,将文章模板更改为 articleBuilder。现在就像一个魅力。

article.js

export const query = graphql`
  query articleBuilder($slug: String!) 
    kenticoCloudItemArticle(elements:  url_slug:  value:  eq: $slug   ) 
      elements 
        article_title 
          value
        
        article_content 
          value
        
        article_date 
          value
        
        url_slug 
          value
        
      
    
  
`;

blog-post.js

export const query = graphql`
  query blogBuilder($slug: String!) 
    kenticoCloudItemBlogPost(elements:  url_slug:  value:  eq: $slug   ) 
      elements 
        blog_title 
          value
        
        blog_content 
          value
        
        blog_date 
          value
        
        url_slug 
          value
        
      
    
  
`;

【问题讨论】:

你有源代码可以在本地试用吗? 我刚刚解决了它。问题是模板页面上的查询。他们被命名为相同的东西。请参阅上面的编辑。 【参考方案1】:

问题出在每种数据类型的模板中。我将这两个查询都命名为 templateBuilder。我将博客模板更改为 blogBu​​ilder,将文章模板更改为 articleBuilder。

有关更多详细信息和代码示例,请参见上面的编辑。

【讨论】:

以上是关于在 Gatsby-node.js 中检索多种数据类型时,graphql 重复文档错误的主要内容,如果未能解决你的问题,请参考以下文章

javascript gatsby-node.js strapi两个来源

gatsbyjs:多次使用graphql,还是一次使用并通过上下文传递结果?

Gatsby `createPage` 正在生成具有相同数据的页面

结构化和检索具有多种大小的 JSON 对象(图像)

在全局数据类中存储和检索数据

从单元格中检索多个字体数据