graphql - 自定义架构、接口、@fileByRelativePath 和 gatsby-image

Question

我正在尝试使接口与新的 @fileByRelativePath 解析器扩展一起使用，以保持与 v3 的兼容。

我将 Prismic 用于我的内容，并使用 gatsby-source-prismic v2。我在 Prismic 中有两种内容类型，并创建了界面以便能够更轻松地查询和映射这两种内容以获取主页索引。

这是功能（但不推荐使用的推断解析器）架构：

exports.createSchemaCustomization = ({ actions }) => {
  const { createTypes } = actions
  const typeDefs = `
        interface indexPosts @nodeInterface {
            id: ID!
            uid: String!
            data: Data!
            type: String!
        }

        type Data {
            title: Title!
            date: Date!
            featured: String!
            featured_image: Featured_image!
            body: Body!
        }

        type Title {
            text: String!
        }

        type Featured_image {
            localFile: File!
        }

        type Body {
            html: String!
        }

        type PrismicGallery implements Node & indexPosts {
            uid: String!
            data: Data!
            type: String!
        }

        type PrismicEssay implements Node & indexPosts {
            uid: String!
            data: Data!
            type: String!
        }
    `
  createTypes(typeDefs)
}

将 @fileByRelativePath 添加到 Featured_image 类型定义后出现问题。这样做会在构建期间给我一个错误：

““路径”参数必须是字符串类型。接收到的类型未定义“

考虑到我的图像是第三方托管的，我不确定如何提供必要的路径参数。我正在尝试遵循本页末尾的简要指南，并怀疑这样做的方法可能是使用解析器或类型生成器并使用“源”来访问由 localFile 及其父级特征图像提供的 url 字段，但我想不通！

我正在使用 gatsby-image 和 childImageSharp 便利字段来呈现图像，如果这有什么不同的话！

标签： graphqlgatsbyprismic.io

Answer 1

当我尝试使用@fileByRelativePath. 我设法通过@infer使用type包含File.

尝试这个：

type Featured_image @infer {
  localFile: File!
}