За замовчуванням, коли ти виводиш дату будь-де на сторінці Eleventy за допомогою запису post.date, ти отримаєш довжелезний рядок із повною датою, ось такий:

Fri Oct 16 2020 23:58:05 GMT+0300 (GMT+03:00)

Почитавши офіційну документацію, ти зможеш скоротити запис за допомогою коду post.date.toDateString() до ось такого:

Fri Oct 16 2020

А що робити, коли ти хочеш якийсь інший формат дати? В документації більше нічого цікавого немає!

І тут на поміч приходить логічне мислення. toDateString() – стандартний метод JavaScript, отже ми можемо використати інші його методи, пов'язані з датою.

Метод toISOString()

Так, якщо ми запишемо коротко post.date.toISOString(), то знову отримаємо довжелезний рядок:

2020-10-16T20:58:05.351Z

Але якщо приглянутися ближче, то побачимо, що перші три групи чисел до великої літери T є датою без часу. Тобто ми можемо обрізати лишнє записом post.date.toISOString().substr(0, 10) та отримати коротку дату в нормальному вигляді:

2020-10-16

Добре, а як бути, коли ти хочеш вивести число, місяць та рік у зворотньому порядку і, наприклад, замінити роздільники на крапки?

Для цього просто виводимо метод toISOString() тричі, кожного разу вирізаючи необхідний уривок запису, ось так:

{{ post.date.toISOString().substr(8, 2) }}.{{ post.date.toISOString().substr(5, 2) }}.{{ post.date.toISOString().substr(0, 4) }}

Виведення дати з допомогою плаґіна Luxon

Весь процес модифікації дати можна глобально спростити, використавши плаґін Luxon. Для цього додай у файл .eleventy.js наступні рядки:

const { DateTime } = require("luxon");
module.exports = function(eleventyConfig) {
  eleventyConfig.addFilter("readableDate", dateObj => {
    return DateTime.fromJSDate(dateObj, {zone: 'Europe/Kiev'}).toFormat("dd.LL.yyyy");
  });
};

Тепер ти можеш додавати дату в будь-якому місці шаблона отаким простим способом:

{{ post.date | readableDate }}