/gatsby-source-filesystem-frontmatter

Gatsby plugin which parses files within a directory for further parsing by other plugins, while also parsing YAML front matter from all files.

Primary LanguageJavaScript

gatsby-source-filesystem-frontmatter

Adds support for reading frontmatter from any file to gatsby-source-frontmatter.

Install

npm install --save gatsby-source-filesystem-frontmatter

How to use

Review the documentation and examples from gatsby-source-frontmatter.

gatsby-source-filesystem-frontmatter adds a frontMatter option to gatsby-source-filesystem.

// In your gatsby-config.js
module.exports = {
  plugins: [
    {
      resolve: `gatsby-source-filesystem-frontmatter`,
      options: {
        // options from gatsby-source-filesystem are supported
        name: `data`,
        path: `${__dirname}/src/data/`,
        ignore: [`**/\.*`], // ignore files starting with a dot
        frontMatter: true // read frontmatter from files in this directory
      },
    }
  ]
}

Options

If the frontMatter option is set to true, gatsby-source-filesystem-frontmatter will attempt to read YAML front matter from each file using gray-matter.

Given the following file:

---
author: Geoffrey Challen
---

= Test

This is a test. This is only a test.

You can query attributes defined in its front matter like this:

{
  allFile {
    edges {
      node {
        frontMatter {
          author
        }
      }
    }
  }
}

Or, if you are using a page query to get Asciidoc content, for example, your query will look like this:

export const pageQuery = graphql`
  query($id: String!) {
    asciidoc(id: { eq: $id }) {
      document {
        title
      }
      parent {
        ... on File {
          frontMatter {
            author
          }
        }
      }
      html
    }
  }
`