在 netlify cms 和 gatsby js 中使图像可选

Posted

技术标签:

【中文标题】在 netlify cms 和 gatsby js 中使图像可选【英文标题】:Make an image optional in netlify cms and gatsby js 【发布时间】:2020-05-06 14:59:00 【问题描述】:

我有一个相当简单的 Gatsby & Netlify CMS 网站。我无法应付使图像可选的问题。对于 Netlify CMS,只需设置一个字段 required: false。如何为 Gatsby 编写查询,以免出现错误“GraphQL 错误字段“图像”不能选择,因为“字符串”类型没有子字段。当图像实际上是一个空字符串,因为它在我的应用程序中不是强制性的?有没有办法解决这个问题?

GraphQL 图像查询:

image 
  childImageSharp 
    fluid(maxWidth: 2048) 
      ...GatsbyImageSharpFluid
    
  

【问题讨论】:

【参考方案1】:

在您的 gatsby-node.js 中,您必须定义一个 graphql 类型来处理这种情况。

exports.createSchemaCustomization = ( actions ) => 
  const  createTypes  = actions;
  const typeDefs = `
    type MarkdownRemark implements Node 
      frontmatter: Frontmatter
    
    
    type Frontmatter @infer 
      yourimage: File @fileByRelativePath,
    
  `;
  createTypes(typeDefs);
;

【讨论】:

以上是关于在 netlify cms 和 gatsby js 中使图像可选的主要内容,如果未能解决你的问题,请参考以下文章

卡在构建 gatsby-starter-netlify-cms

Gatsby 和 Netlify CMS 预览错误与渲染 StaticQuery

部署在 Netlify 上的 Gatsby 站点未更新来自 graphcms 的数据

如何为 Netlify CMS 正确设置 cloudinary?

带有 Netlify CMS 的 Gatsby 图像 - 字段“图像”不能有选择,因为类型“字符串”没有子字段

将 Gatsby 博客部署到 Netlify 时出错