Question

说明我遇到本地错误，开发人员无法读取未定义的'childImageSharp'属性。

复制步骤 https://github.com/aaronearl/thurz-party

运行：gatsby develop

预期结果预期结果是在事件部分下方显示图像“ LATHURZ”。但是，这没有发生。我收到上述错误“无法读取未定义的属性'childImageSharp'。

实际结果实际结果是未定义的childImageSharp

发生了什么事。我已经检查过我的查询：

query Images {
image: file(relativePath: { eq: "lathurz.jpg" }) {
childImageSharp {
fixed(width: 400) {
...GatsbyImageSharpFixed
}
fluid {
...GatsbyImageSharpFluid
}
}
}
}

我认为它在操场上正确执行是正确的。

环境系统：

OS: OS X El Capitan 10.11.6
CPU: (4) x64 Intel(R) Core(TM) i7-2677M CPU @ 1.80GHz
Shell: 5.0.8 - /bin/zsh
Binaries:
Node: 11.4.0 - /usr/local/bin/node
Yarn: 1.12.3 - /usr/local/bin/yarn
npm: 6.8.0 - /usr/local/bin/npm
Languages:
Python: 2.7.15 - /usr/local/bin/python
Browsers:
Chrome: 77.0.3865.120
Safari: 9.1.2
npmPackages:
gatsby: ^2.0.64 => 2.15.36
gatsby-image: ^2.0.15 => 2.2.27
gatsby-plugin-manifest: ^2.0.5 => 2.2.21
gatsby-plugin-netlify: ^2.0.6 => 2.1.19
gatsby-plugin-offline: ^2.0.11 => 2.2.10
gatsby-plugin-react-helmet: ^3.0.0 => 3.1.11
gatsby-plugin-sharp: ^2.0.7 => 2.2.29
gatsby-plugin-styled-components: ^3.0.4 => 3.1.9
gatsby-source-filesystem: ^2.0.11 => 2.1.31
gatsby-transformer-json: ^2.1.6 => 2.2.13
gatsby-transformer-sharp: ^2.1.4 => 2.2.21
npmGlobalPackages:
gatsby-cli: 2.7.28

Answer 1

查看您的代码，我相信问题是“ pageQuery”实际上是两个单独的查询。代替：

export const pageQuery = graphql`
  query indexQuery {
    [...]
  }
  query Images {
    image: file(relativePath: { eq: "lathurz.jpg" }) {
      childImageSharp {
        fixed(width: 400) {
          ...GatsbyImageSharpFixed
        }
        fluid {
          ...GatsbyImageSharpFluid
        }
      }
    }
  }
`

尝试：

export const pageQuery = graphql`
  query{
    [...]
    image: file(relativePath: { eq: "lathurz.jpg" }) {
      childImageSharp {
        fixed(width: 400) {
          ...GatsbyImageSharpFixed
        }
        fluid {
          ...GatsbyImageSharpFluid
        }
      }
    }
  }
`

无法读取未定义的属性“ childImageSharp”

1 个答案: