Skip to main content

Netlify CMS Config generator

This is a Deno’s TypeScript library to generate the config.yml file to configure the Netlify CMS easily. For more info about the Netlify Configuration Options, go to the original documentation website.

Usage example

The library is built in TypeScript, including the options descriptions as comments, so you can take advantage of your VSCode (or any other IDE) like autocomplete, descriptions etc.

Create simple field

import f from "./mod.ts";

const field = f.string("Your name");

console.log(field.toJSON());

This code generates the following result:

{
  label: "Your name",
  name: "your_name",
  widget: "string"
}

By default, the name value is generated automatically from the label. But you can change it or add more options:

const field = f.string("Your name")
  .name("name")
  .required(false)
  .default("Default name")
  .toJSON();

This outputs:

{
  label: "Your name",
  name: "name",
  widget: "string",
  required: false,
  "default": "Default name",
}

Create a folder collection

import f from "./mod.ts";

const posts = f.folder("Posts", "/posts")
  .create(true)
  .slug("{{slug}}")
  .delete(true)
  .fields([
    f.string("Title"),
    f.datetime("Published at"),
    f.markdown("Body"),
  ])
  .toJSON();

This outputs:

{
  label: "Posts",
  name: "posts",
  folder: "/posts",
  create: true,
  slug: "{{slug}}",
  delete: true,
  fields: [
    {
      label: "Title",
      name: "title",
      widget: "string"
    },
    {
      label: "Published at",
      name: "published_at",
      widget: "datetime"
    },
    {
      label: "Body",
      name: "body",
      widget: "markdown"
    },
  ]
}

Create a files collection

import f from "./mod.ts";

const posts = f.files("Pages")
  .file("Page 1", "page-1.md", [
    f.string("Title"),
    f.datetime("Published at"),
    f.markdown("Body"),
  ])
  .file("Page 2", "page-2.md", [
    f.string("Title"),
    f.datetime("Published at"),
    f.markdown("Body"),
  ])
  .toJSON();

Default values

To avoid repetition, you can set default values:

import f from "./mod.ts";

// Special case to set the `required` option to false
// applied to all fields
f.defaultRequired = false;

// Configure settings individually by field
f.defaults.markdown.buttons(["bold", "italic", "link"]);
f.defaults.list.collapsed(true).minimizeCollapsed(true);