1

Gatsby の Web サイトで作業を行っていますが、「TypeError: 未定義のプロパティ 'childImageFluid' を読み取れません」というメッセージが引き続き表示されます。

私が持っているコードは、これが Project.js ファイルにあります

import React from "react"
import PropTypes from "prop-types"
import Image from "gatsby-image"
import { FaGithubSquare, FaShareSquare } from "react-icons/fa"
const Project = ({description, title, github, stack, url, image, index}) => {
  return (
    <article className="project">
      <Image fluid={image.childImageFluid.fluid} className="project-img" />
    </article>
  ) 
}

Project.propTypes = {}

export default Project

そして、表示されるindex.jsファイルにgraphqlを設定しましたが、すべてがgraphqlで正常に機能しています...

export const query = graphql`
         {
           allStrapiProjects(filter: { featured: { eq: true } }) {
             nodes {
               github
               id
               description
               title
               url
               image {
                 childImageSharp {
                   fluid {
                     ...GatsbyImageSharpFluid
                   }
                 }
               }
               stack {
                 id
                 title
               }
             }
           }
         }
       `

Project.js ファイルで作業しているものまですべてが私の github - https://github.com/matthewbert86/gatsby-siteにありますが、そのコードはすべて上記の最初のコード セクションにあります。

4

1 に答える 1