Javascript 当我'；我只使用一个图像查询？

第一次在这里发帖，但我似乎不明白这一点。我正在与盖茨比一起构建一个单页应用程序，并且一直在使用带有盖茨比图像和盖茨比背景图像的GraphQL。这一直工作正常，但现在我得到一个GraphQL错误，说我有相同名称的重复查询

我一直在尝试将站点部署到GitHub页面以显示客户端，并在遇到此错误时尝试对此进行故障排除。我甚至不知道在哪里可以找到复制品

我在pages/index.js中的查询：

export const query = graphql`
  query{
    headerGlasses: file(relativePath: { regex: "/header-glasses/" }) {
      childImageSharp {
        fluid(maxWidth: 1000) {
          ...GatsbyImageSharpFluid
        }
      }
    }
    eyeGlasses: file(relativePath: { regex: "/eyeglasses/" }) {
      childImageSharp {
        fluid(maxWidth: 1000) {
          ...GatsbyImageSharpFluid
        }
      }
    }
    headerSunglasses: file(relativePath: { regex: "/header-sunglasses/" }) {
      childImageSharp {
        fluid(maxWidth: 1000) {
          ...GatsbyImageSharpFluid
        }
      }
    }
    skiGoggles: file(relativePath: { regex: "/ski-goggles/" }) {
      childImageSharp {
        fluid(maxWidth: 1000) {
          ...GatsbyImageSharpFluid
        }
      }
    }
    showRoom: file(relativePath: { regex: "/show1/" }) {
      childImageSharp {
        fluid(maxWidth: 1000) {
          ...GatsbyImageSharpFluid
        }
      }
    }
  }
`

gatsby-config.js

module.exports = {
  siteMetadata: {
    title: `Diamond Opticians`,
    description: `Kick off your next, great Gatsby project with this default starter. This barebones starter ships with the main Gatsby configuration files you might need.`,
    author: `Brendan McCaughey`,
  },
  plugins: [
    `gatsby-plugin-react-helmet`,
    {
      resolve: `gatsby-source-filesystem`,
      options: {
        name: `images`,
        path: `${__dirname}/src/images`,
      },
    },
    `gatsby-transformer-sharp`,
    `gatsby-plugin-sharp`,
    {
      resolve: `gatsby-plugin-manifest`,
      options: {
        name: `gatsby-starter-default`,
        short_name: `starter`,
        start_url: `/`,
        background_color: `#663399`,
        theme_color: `#663399`,
        display: `minimal-ui`, // This path is relative to the root of the site.
      },
    },
    `gatsby-plugin-styled-components`
    // this (optional) plugin enables Progressive Web App + Offline functionality
    // To learn more, visit: https://gatsby.dev/offline
    // `gatsby-plugin-offline`,
  ],
  pathPrefix: "/diamond-opticians",
}

package.json

{
  "name": "gatsby-starter-default",
  "private": true,
  "description": "A simple starter to get up and developing quickly with Gatsby",
  "version": "0.1.0",
  "author": "Kyle Mathews <mathews.kyle@gmail.com>",
  "dependencies": {
    "babel-plugin-styled-components": "^1.10.0",
    "gatsby": "^2.3.15",
    "gatsby-background-image": "^0.6.2",
    "gatsby-image": "^2.0.37",
    "gatsby-plugin-manifest": "^2.0.27",
    "gatsby-plugin-offline": "^2.0.25",
    "gatsby-plugin-react-helmet": "^3.0.12",
    "gatsby-plugin-sharp": "^2.0.32",
    "gatsby-plugin-styled-components": "^3.0.7",
    "gatsby-source-filesystem": "^2.0.29",
    "gatsby-transformer-sharp": "^2.1.17",
    "google-map-react": "^1.1.4",
    "intersection-observer": "^0.7.0",
    "prop-types": "^15.7.2",
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "react-helmet": "^5.2.0",
    "smooth-scroll": "^16.0.3",
    "styled-components": "^4.2.0"
  },
  "devDependencies": {
    "gh-pages": "^2.0.1",
    "prettier": "^1.16.4"
  },
  "keywords": [
    "gatsby"
  ],
  "license": "MIT",
  "scripts": {
    "build": "gatsby build",
    "develop": "gatsby develop",
    "format": "prettier --write src/**/*.{js,jsx}",
    "start": "npm run develop",
    "serve": "gatsby serve",
    "test": "echo \"Write tests! -> https://gatsby.dev/unit-testing\"",
    "deploy": "gatsby build --prefix-paths && gh-pages -d public"
  },
  "repository": {
    "type": "git",
    "url": "https://github.com/gatsbyjs/gatsby-starter-default"
  },
  "bugs": {
    "url": "https://github.com/gatsbyjs/gatsby/issues"
  }
}

我还遇到了这个错误，它似乎来自我的几个节点模块：

未捕获的TypeError:无法读取未定义的属性“headerGlasses”

---

我假设这是由于上述问题导致查询无法执行的结果

您是否在应用程序中的其他位置进行了更多graphQL查询？您是否可以共享指向您的repo的链接？。我还添加了layout.js代码和其他查询。很酷，谢谢。如果命名

index.js

查询，会发生什么？类似于第134行的

queryindexquery{…}

当我尝试这样做时，我得到一个类似的错误：

GraphQL错误编译站点的GraphQL查询时出错。错误：RelayParser:遇到一个或多个文档的重复定义：每个文档必须具有唯一的名称。重复文档：-IndexQuery

您是否在应用程序中的其他位置进行了更多graphQL查询？您是否可以共享指向您的回购的链接？。我还添加了layout.js代码和其他查询。很酷，谢谢。如果命名

index.js

查询，会发生什么？类似于第134行的

queryindexquery{…}

当我尝试这样做时，我得到一个类似的错误：

GraphQL错误编译站点的GraphQL查询时出错。错误：RelayParser:遇到一个或多个文档的重复定义：每个文档必须具有唯一的名称。重复文档：-索引查询

  <StaticQuery
    query={graphql`
      query SiteTitleQuery {
        site {
          siteMetadata {
            title
          }
        }
    }
    `}
    render={data => (
      <>
        <Header siteTitle={data.site.siteMetadata.title} />
        <div
          style={{
            margin: `0 auto`,
            maxWidth: `100vw`,
            paddingTop: 0,
          }}
        >
          <main>{children}</main>
          <Footer>
            © {new Date().getFullYear()} Diamond Opticians
          </Footer>
        </div>
      </>
    )}
  />
)

GraphQL Error There was an error while compiling your site's GraphQL queries.
  Error: RelayParser: Encountered duplicate defintitions for one or more documents: each document must have a unique name. Duplicated documents:
- cUsersBrendCodingProjectsDiamondOpticiansSrcPagesIndexJs3730803733