如何从Gatsbyjs中的另一个节点上的url字段下载图像，以便我可以使用gatsby-image？

Question

我正在使用Gatsby和Kentico Cloud为网站进行图像优化。我想使用gatsby-image插件，但gatsby-image无法查询url字段。因此，我需要从另一个节点上的CMS下载这些图像，以便gatsby-image可以查询它们。

我试图使用另一个插件gatsby-plugin-remote-images实现这一点，但到目前为止它还没有奏效。我不确定我是否误解了文档。

这是我从gatsby-config获得的最新代码

{
  resolve: `gatsby-plugin-remote-images`,
  options: {
    nodeType: 'kenticoCloudItemAbout',
    imagePath: 'data.kenticoCloudItemAbout.elements.main_image.value[0].url'
  }
}

我的理解是，我现在应该能够从GraphiQL查询localImage（重启服务器后）并查看下载的文件路径，但这似乎不起作用。

谢谢！

Answer 1

作为GatsbyJS的新手，在开始工作之前，我也在努力解决这个问题。首先，我认为你的imagePath配置不应该包含data.，它是组件中用于返回graphQL结果的变量。从kenticoCloudItemAbout开始。如果这不起作用，我发现嵌套的imagePath存在问题。 （要么我还不了解imagePath的正确用法，要么插件不喜欢嵌套结构。）例如，我的GraphQL查询/数据结构是这样的：

  {
  allMyNodes{
    edges {
      node {
            levelOneField
            subItem {
              levelTwoField
              subSubItem {
                imageURL
              }
            }
          }
        }
      }
    }

当我使用{ nodeType="myNodes", imagePath="myNodes.edges.node.subitem.subsubitem.imageURL"}时，我没有任何运气让插件工作。但是，当使用像{ nodeType="subSubItem", imagePath="imageURL"}这样的imageURL直接指向节点时，它可以工作。此外，在构建gatsby develop时，请注意终端中的错误。像imageURL没有指向文件（断开的链接）等错误导致了麻烦。最后，确保您没有在GraphiQL窗口中包含GraphQL片段（例如...GatsbyImageSharpFluid）。在GraphiQL中，只尝试引用localImage对象属性来测试插件是否适合您。例如：

{
    allSubSubItem {
      imageURL
      localImage {
         id
      }
    }
 }