Gatsby GraphQL query for multiple images

I'm stuggling to figure out how to query for multiple specific images with GraphQL in Gatsbyjs. My initial thought was to do something like this:

file(relativePath: {eq: "images/front.jpg"}) {
  id
}
file(relativePath: {eq: "images/front2.jpg"}) {
  id
}

This throws an error in GraphQL:

{
  "errors": [
    {
      "message": "Fields \"file\" conflict because they have differing arguments. Use different aliases on the fields to fetch both if this was intentional.",
      "locations": [
        {
          "line": 28,
          "column": 1
        },
        {
          "line": 31,
          "column": 1
        }
      ]
    }
  ]
}

Querying for one specific file (image) works fine:

file(relativePath: {eq: "images/front.jpg"}) {
  id
}

Any suggesting of what I'm doing wrong here? Thanks :)

Upvotes: 7

Views: 5926

Answers (1)

Found out the trick is to use aliases as described in the graphQL docs

In my case changing the query to this seems to do the trick:

front: file(relativePath: {eq: "images/front.jpg"}) {
  id
}
front2: file(relativePath: {eq: "images/front2.jpg"}) {
  id
}

Upvotes: 17

Related Questions