Question

我正在尝试将文件节点添加到不会自动创建它们的gatsby源中（在这种情况下为gatsby-source-tumblr）。每个节点都有一组相关的图像，我想下载这些图像，然后再使用Gatsby-Image进行转换。

到目前为止，这是我的代码：

exports.onCreateNode = async ({
  node,
  actions: { createNode, createNodeField },
  store,
  cache,
  getCache,
  createNodeId,
}) => {
  if (node.internal.type === `TumblrPost`) {
    const pathValue = "/posts/" + node.slug
    createNodeField({
      node,
      name: `path`,
      value: pathValue,
    })
  }

  if (
    node.internal.type === `TumblrPost` &&
    node.photos &&
    node.photos.length
  ) {
    await node.photos.map(async photo => {
      let fileNode
      try {
        fileNode = await createRemoteFileNode({
          url: photo.original_size.url,
          parentNodeId: node.id,
          getCache,
          createNode,
          cache,
          createNodeId,
          store,
        })
        // Adds a field `localFile` to the node
        // ___NODE appendix tells Gatsby that this field will link to another node
        if (fileNode) {
          photo.localFile___NODE = fileNode.id
        }
      } catch (err) {
        console.warn(err)
      }
    })
  }
}

根据我发现的多个教程的建议，我正在使用createRemoteFileNode下载图像并将其添加为文件节点。 这部分有效，我可以看到正在下载的图像，并且在allImageSharp类别下的GraphiQL中有很多项目可见。

但是我似乎无法使与父节点的关联正常工作。做类似photo.localFile___NODE = fileNode.id的事情似乎没有任何效果。尝试将一个图像甚至添加到父节点（发布）似乎都不起作用：在GraphiQL检查器中查看发布节点时，没有文件节点的痕迹。

我觉得我可能会遗漏一些明显的东西，但是我已经摆弄了好几个小时，似乎无法弄清楚。

任何帮助将不胜感激！

Answer 1

我发现this answer可以帮助我修复它。我认为问题出在我如何处理异步循环。我复制了设置product.images的代码（在该其他用户的代码库中），并对其进行了改编，使其有效。我猜_等待Promise.all_是关键。

这对我来说很奇怪，因为有一点我引入了很棒的async库（比await等更熟悉的东西）来确保没有任何问题。循环，这是行不通的。嗯，生活就是这样。我很高兴它现在可以正常工作。

无法将远程文件节点添加到父节点Gatsby

1 个答案: