编辑:我最终创建了我的问题的一小幅复制品,并将其发布到Gatsby的GitHub,最终得到了一些帮助。这是该问题的link!
如果该问题在其他地方得到了解决,请先抱歉,但是我找不到所需的答案。
我目前正在使用Gatsby,GraphQl和YAML文件,并且我要映射多个部分,但是有些部分包含图像,有些则没有。我通过用childImageSharp声明图像来定义我的GraphQL
sections {
title
description
imageHere {
childImageSharp {
fluid(maxWidth: 600) {
...GatsbyImageSharpFluid_noBase64
}
}
}
并且我看到了一个解决方案,涉及将其添加到我的gatsby-node.js中,以便可以从我的YAML文件中正确读取路径
exports.createSchemaCustomization = ({ actions }) => {
const { createTypes } = actions;
const typeDefs = `
type allProjectPageYaml implements Node {
imageHere: [String]!
}
`;
createTypes(typeDefs);
};
现在我的问题是,某些部分具有imageHere字段,而有些则没有
sections:
- title: Title 1
description: Description 1
- title: Title 2
description: Description 2
imageHere: Image1
我得到的错误是TypeError:无法读取null的属性'childImageSharp'
我的解决方法是什么?
您已将imageHere
定义为必需的字符串数组,其内容为:imageHere: [String]!
。
如果实际上应该是一个可选的图像节点,则可能需要将其定义为正确的类型(类似于GatsbyImage
,但我无法确切地记住它是临时使用的,您应该能够检查graphiql)。看起来更像imageHere: GatsbyImage
(没有爆炸,没有方括号)。