This article has been imported from coding4.gaiama.org and is not necessarily up to date!

Query parent File node in GatsbyJS

Last updated: 
Published: 
{
  mdx {
    frontmatter {
      title
    }
    parent {
      ... on File {
        relativePath
        changeTime
      }
    }
  }
}

When querying a Markdown/MDX node in GatsbyJS I always wondered how to get information of the parent file and why only file.absolutePath has been included as mdx.fileAbsolutePath. Then one day I came across some GraphQL magic I didn't fully understand and sadly couldn't remember nor find again. 😅

That's the main reason for this post. It serves as a note to myself and hopefully serves others as well as I think it's quite usefull.

Thanks to a video about the new Facebook.com using GraphQL and Relay which showed inline fragments, leading me to the right syntax 🙏. By the way, I found the video pretty informative to watch including cool techniques to build a more accessible and user friendly web.

Why has only absolutePath been added to the md/mdx node?
I think it's for filtering, because AFAIK you can't use the inline fragment syntax in filters.

More about inline fragments in the GraphQL Docs.

Can Rau
Can Rau

Doing web-development since around 2000, building my digital garden with a mix of back-to-the-roots-use-the-platform and modern edge-rendered-client-side-magic tech 📻🚀

Living and working in the tropical rainforest of Perú 🐒