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

Posted 2023-03-08

【中文标题】自定义架构、接口、@fileByRelativePath 和 gatsby-image

【英文标题】：Custom schema, interface, @fileByRelativePath and gatsby-image

【发布时间】：2020-05-07 06:19:33

【问题描述】：

我正在尝试获得一个与新的 @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 类型定义后出现问题。这样做会在构建期间给我一个错误：

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

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

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

【问题讨论】：

是的，同样的问题。你找到解决方案了吗？

【参考方案1】：

当我尝试使用@fileByRelativePath 时，我遇到了完全相同的问题。我设法通过在包含File 的type 上使用@infer 来解决我的问题。

试试这个：

type Featured_image @infer 
  localFile: File!