How to use pug options in v3

peekxc commented 3 weeks ago

To add arbitrary JS functions in V2 to pug, e.g.

eleventyConfig.addFilter("readingTime", (content) => {
    const stats = readingTime(content, { 'wordsPerMinute': 400 });
    return stats.text + ", " + stats.words + " words";
});

It was sufficient to add:

global.filters = eleventyConfig.javascriptFunctions; 
eleventyConfig.setPugOptions({ 
  globals: ['filters'],
  debug: false
});

This seems to no longer work. How can I add filters to use with pug in v3 (beta)?

So far my best attempt was:

import pugPlugin from "@11ty/eleventy-plugin-pug";
....
export default function (config) {
....
pugPlugin.options = { 
    globals: ['filters'],
    debug: false, 
    filters: { "readingTime" : readingTime }
}
config.addPlugin(pugPlugin);
...

But this did not work. Based on these docs is this just not supported yet?

peekxc commented 3 weeks ago

(this might be a question for @Zearin)

peekxc commented 2 weeks ago

Update!

From scanning the source, I've figured out that the following works in v3:

eleventyConfig.addPlugin(pugPlugin, { 
    globals: ['filters'],
    debug: false, 
    filters: eleventyConfig.getFilters({ type: "sync" }),
});

Presumeably, this needs to be done after filters have been added, a la:

eleventyConfig.addFilter("readingTime", reading_time);

Usage is now identical to the globals trick from v2 mentioned in #1

11ty / eleventy-plugin-template-languages

How to use pug options in v3 #16