Gatsby: Querying a single markdown file for a page.

[zasuh]

Summary

I'm making an about page for my site and want to use a single .md file to write the text. Is there some documentation on how to do this? All I can find is creating pages dynamically for blogs but not how to use markdown for a single page.

[connorlindsey]

The process is pretty similar to dynamically generating pages. Follow the setup from this tutorial to get the file-system and transformer-remark working: https://www.gatsbyjs.org/docs/adding-markdown-pages/

Once that is done, you'll need to use a StaticQuery if you want the data in a component or a PageQuery if you want it on a page. You can use GraphiQL to test your query and make sure you can get the right page: https://www.gatsbyjs.org/docs/running-queries-with-graphiql/

You'll basically be adjusting the query from the tutorial. This is the pageQuery from the tutorial:

export const pageQuery = graphql`
  query($path: String!) {
    markdownRemark(frontmatter: { path: { eq: $path } }) {
      html
      frontmatter {
        date(formatString: "MMMM DD, YYYY")
        path
        title
      }
    }
  }
`

Instead of passing in a variable ($path), you can directly pass in the path to the about markdown file. Something like this:

export const pageQuery = graphql`
  query {
    markdownRemark(frontmatter: { path: { eq: "pathToYourMarkdownFile" } }) {
      html
      frontmatter {
        date(formatString: "MMMM DD, YYYY")
        path
        title
      }
    }
  }
`

[LekoArts]

Thank you for opening this!

As Connor already wrote you can do a markdownRemark query instead of a allX query and filter by something unique, e.g. the slug.

We're marking this issue as answered and closing it for now but please feel free to comment here if you would like to continue this discussion. We also recommend heading over to our communities if you have questions that are not bug reports or feature requests. We hope we managed to help and thank you for using Gatsby!