Use Luxon to prettify post.data.publishedOn?

[8bit-mainstream]

Hi, I love your 11ty template!

I tried to add a custom filter to shorten the time and date of the publishedOn custom property, because I've added a blogroll to the index.md and the date pulled from post.data.publishedOn reads something like: Sun Sep 01 2024 02:00:00 GMT+0200 (Mitteleuropäische Sommerzeit)

{% for post in collections.post %} 
<h4>{{ post.data.title }}</h4>
<p>{{ post.data.publishedOn | prettyDate }}</p>
<p>{{ post.data.excerpt }}</p>
<a href="{{ post.url | url }}">read more</a>
<hr>
{% endfor %}

The custom filter and call for Luxon is added to the .eleventy.js

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

module.exports = function (eleventyConfig) {
  eleventyConfig.addFilter("prettyDate", (dateObj) => {
   return DateTime.fromJSDate(dateObj).toLocaleString(DateTime.DATE_MED);
  });
}

But I get the error(s): [11ty] 1. Having trouble rendering njk template ../index.md (via TemplateContentRenderError) [11ty] 2. (../index.md) [11ty] Error: filter not found: prettyDate (via Template render error)

Could you please point me in the right direction?

[rothsandro]

Did you add the filter to the existing .app/.eleventy.js file? Creating a separate config file in the root of the project will not work.

If yes, please provide a reproduction.

[8bit-mainstream]

Yes, I did use the .app/.eleventy.js

How/where would you like to see the reproduction?

[rothsandro]

Can you share a repository on Github?