How can I generate a JSON file from my content?

[dave-kennedy]

Say I have this structure:

content
└ notes
  ├ a.md
  ├ b.md
  └ index.md

Where a.md contains:

---
title: A
description: This is a test.
---

Blah blah blah...

And b.md contains:

---
title: B
description:  This is another test.
---

Yadda yadda...

I want to output:

_site
└ notes
  ├ data.json
  └ index.html

Where data.json contains:

[
  {"title": "A", "description": "This is a test."},
  {"title": "B", "description": "This is another test."}
]

My first idea was to add a collection:

  eleventy.addCollection('notes', function (collections) {
    return collections.getFilteredByGlob('content/notes/*.md');
  });

Then add this file to content/notes/data.json (based on this guide):

[
  {% for note in collections.notes %}
    {
      "title": "{{ note.title }}",
      "description": "{{ note.description }}"
    }{% unless @last %},{% endunless %}
  {% endfor %}
]

But the JSON file doesn't end up in the _site directory.

Is there a better way?

[dwkns]

Edited as I'm not sure which template language you're using. Thought it was liquid but that doesn't have @last

---

You're on the right track. The issue is that you're adding your source file content/notes/data.json as a .json file. .json files are not considered template files and by default will not be processed.

Instead rename it to content/notes/data.njk so it becomes a template file and will be processed. You can use any template language you like, but I know Nunjucks so the code below should work.

You'll also want to add a permalink to the front matter of your template. This defines where the file is written out to and importantly allows you to set .json as it's file extension. If you don't set a permalink .html will be the default.

content/notes/data.njk

---
permalink: /content/notes/data.json
---
[
  {%- for note in collections.notes %}
    {
      "title": "{{ note.title }}",
      "description": "{{ note.description }}"
    }{% if not loop.last %},{% endif %}
  {% endfor -%}
]

Note the {%- and -%} in some (but not all) places in the code. These the - removes whitespace so the output is nicely formatted. Not strictly necessary but poorly formatted json makes me weep.

[dave-kennedy]

Nice! I had to make a few other changes:

• Unset the layout, because it was inheriting from the directory data
• Add liquid to setTemplateFormats in eleventy.config.js
• Change note.title to note.data.title and note.description to note.data.description
• Use Liquid's forloop.last instead of @last

---
layout: null
permalink: "/notes/data.json"
---

[
  {% for note in collections.notes -%}
  {
    "title": "{{ note.data.title }}",
    "description": "{{ note.data.description }}"
  }{% if forloop.last != true %}, {% endif %}
  {%- endfor %}
]

Here's the result:

[
  {
    "title": "A",
    "description": "This is a test."
  }, {
    "title": "B",
    "description": "This is another test."
  }
]