Skip to main content

Testing dates

  • date: Created

  • page.date: Thu Mar 03 2022 16:30:04 GMT+0000 (Coordinated Universal Time)

    This is the JSDate format to Luxon.

  • page.date.toUTCString(): Thu, 03 Mar 2022 16:30:04 GMT

  • page.date | date('iso'): 2022-03-03T16:30:04.945Z

  • page.date | date('DATE_MED'): Mar 3, 2022

  • page.date | date: Thu, Mar 3, 2022

See Luxon’s docs on toLocaleString for some formatting presets.

At first, I thought I wanted to use Last Modified as the default date for everything. I was thinking in the context of creating a digital garden, where having a “Last Updated” date makes more sense. However, it doesn’t always work on a platform like Netlify. It will be just fine to manually add an updated field in my YAML for this.

Instead of adding multiple date formatting filters, I made one with a parameter that specifies the format output:

const { DateTime } = require("luxon");

eleventyConfig.addFilter("date", (dateObj, type) => {
  // ISO is like "2021-09-15"
  if (type === "iso") return DateTime.fromJSDate(dateObj).toISODate();
  // DATE_FULL is like "September 15, 2021"
  if (type === "nice") return DateTime.fromJSDate(dateObj).toLocaleString(DateTime.DATE_FULL);
  // If no parameter is specified, just return unformatted date
  return dateObj;
});

Use the filter like so: {% page.date | date('iso') %}

Sources: