Gastby JS:注释初始图像引用相对图像还是远程图像

时间:2019-11-13 07:08:09

标签: gatsby gatsby-image

我有两个markdown文件,一个文件引用其飞溅图像的相对图像,另一个文件引用外部图像。

---
cover: relative.jpeg
---
Content Foo

---
cover: https://external.com/external_image.jpg
---
Content Zap

我想像这样用GraphQL引用这两个图像

query {
  allMarkdownRemark {
    edges {
      node {
        frontmatter {
          cover {
            childImageSharp {
              fluid{
                # I'll be using a fragment here instead, but this is a minimal example
                src
              }
            }
          }
        }
      }
    }
  }
}

有没有办法使gatsby-image与外部图像一起使用?另外,是否有一个gatsby插件可以完成此任务?

谢谢!

1 个答案:

答案 0 :(得分:1)

这是可行的,但需要使用i API来处理转换后的markdown节点,并使用gatsby-source-filesystem的onCreateNodecreateRemoteFileNode() API来下载远程图像以应用必要的架构如果您想使用相同的graphql字段访问远程/本地文件,则可以进行自定义扩展名或解析器之类的修改。

或者,我怀疑https://www.gatsbyjs.org/packages/gatsby-plugin-remote-images/确实按照我的描述进行了操作,但是您仍将有两个用于远程/本地数据的单独字段。