Date

Description

This plugin registers the date filter, which allows manipulating and formatting a datetime value in different locales. It uses the date-fns library under the hood.

<time>{{ createdAt | date }}</time>

Installation

Import this plugin in your _config.ts file to use it:

import lume from "lume/mod.ts";
import date from "lume/plugins/date.ts";

const site = lume();

site.use(date());

export default site;

See all available options in Deno Doc.

Formats

By default, the value is formatted to yyyy-MM-dd, but you can use the first argument to set a different format. See the date-fns documentation for more info.

<time>{{ createdAt | date('MM/dd/yyyy') }}</time>

There are some predefined formats that you can use:

<time datetime="{{ createdAt | date }}">
  {{ createdAt | date('HUMAN_DATE') }}
</time>

After installing the plugin you can edit or add more named formats, so it's easier to apply them in templates:

site.use(date({
  formats: {
    "MY_FORMAT": "MM-dd-yyyy",
  },
}));

<time>{{ createdAt | date('MY_FORMAT') }}</time>

Locales

date-fns has support for multiple locales. You can configure them in _config.ts:

import date from "lume/plugins/date.ts";

site.use(date({
  locales: ["gl", "es"],
}));

Use the second argument to set the locale:

<time datetime="{{ createdAt | date }}">
  {{ createdAt | date("HUMAN_DATE", "gl") }}
</time>

The first locale set in the _config.js is also used as the default locale.