Gridsome - Multiple Instances of the Source Filesystem Plugin
Published: 2020-01-27 22:10:43

---
title: Gridsome - Multiple Instances of the Source Filesystem Plugin
published: true
date: 2020-01-26 19:00:00 UTC
tags: 
canonical_url: https://braytonium.com/2020/01/26/gridsome-multiple-instances-of-the-source-filesystem-plugin/
---

In my [last post](https://braytonium.com/2020/01/01/hey-there-gridsome/), I mentioned the transition to Gridsome and it has been relatively pain free. I owe a lot of this to the existing community and the great list of [starter resources](https://gridsome.org/starters/). If a concept isn't explained or clear in the docs, chances are you can gain some insight from the various starters.

One particular concept I had a problem with right out of the gate was how to use markdown files from multiple directories. I started with the post type to handle /year/month/day/title routes but I wanted to move to an equivalent of the generic page type from Hexo. In doing research to the search terms I could've used months ago, I stumbled on [multiple](https://github.com/gridsome/gridsome/issues/401) [issues](https://github.com/gridsome/gridsome/issues/370#issuecomment-483982506) that point out how to do it.

In the file `gridsome.config.js`, I use the following snippet in the plugins section:

```
{
  use: '@gridsome/source-filesystem',
  options: {
    path: 'blog/articles/**/*.md',
    typeName: 'Article',
    refs: {
      authors: {
        typeName: 'Author',
        create: true
      },
    }
  }
},
{
  use: '@gridsome/source-filesystem',
  options: {
    path: 'blog/posts/**/*.md',
    typeName: 'Post',
    refs: {
      authors: {
        typeName: 'Author',
        create: true
      },
      categories: {
        typeName: 'Category',
        create: true
      },
      tags: {
        typeName: 'Tag',
        create: true
      },
    }
  }
},
```

Since Gridsome has a concept of pages already, I chose the word article to represent them instead. As an example, the [portfolio](https://braytonium.com/portfolio/) page is an article type while this page represents a post type. While hindsight makes this seem intuitive now, I somehow had the impression that you were only allowed one plugin type for safety reasons.

To point out something else, the [portfolio](https://braytonium.com/portfolio/) page highlights a technique I didn't think was possible at the time. The parent portfolio page is an article type but all the subsequent child pages are markdown files in a separate portfolio directory as a portfolio type. In the plugins section of `gridsome.config.js`:

```
{
  use: '@gridsome/source-filesystem',
  options: {
    path: 'blog/portfolio/**/*.md',
    typeName: 'Portfolio',
    refs: {
      authors: {
        typeName: 'Author',
        create: true
      },
    }
  }
},
```

Coming from Hexo, I opt for placing content in markdown files and having unique layouts defined in the various `pages` and `templates` files. As much as Gridsome is a generic website framework, I find that it can be extremely flexible to whatever workflow you wish to create. There are some parts of Hexo I miss like scaffolding new page types or steering me into blog concepts but the transition to Gridsome has been rather smooth. While Gridsome may not be for everyone, I can definitely see how JAMstack has gained traction recently. Barring very few gotchas, working on this site is fun again even in the I-can-see-every-blemish state it's currently in.