Formulating Questions

I spent a few hours over the last couple of days upgrading my eleventy setup to "v3.0 canary", and then to tidy up my eleventy config file, taking inspiration from eleventy-excellent. The idea being to move all my custom filters, collections, plugins and shortcodes to module files.

This went very well, but there were a couple of filters that simply didn't work. After several hours of failing to fix them, I relented and decided to ask a question in the eleventy GitHub discussions forum. It took me about 20 minutes to draft the question so that I thought it would be clear.

After the third re-reading and final edits, and literally just as I was hovering over the submit button for the final click, the answer jumped out of my text. It was a dead simple, a stupid error.

Jim Nielsen's Bulletproof Method to Solving Problems came to mind. I made it right to the very end of Step 1, but not further!

This is what I was going to submit, see if you can spot the problem. 🙂

I have upgraded Eleventy to v3.0 canary which has generally worked very well. So I don't think this is related to that (and probably more to my general lack of knowledge...).

I then moved my custom filters from the eleventy.config.js file to a module file. At this point I got an error for one of the filters.

The filter is creating a URL link to the file on github and looks like this in the eleventy.config.js file:

eleventyConfig.addFilter('pathToGitHub', (localPath) => {
    let baseURL = 'https://github.com/..../blob/master/';
    let outURL =  new URL(localPath,baseURL);
    return outURL;
});

This works fine when using the filter like this in my njk file:

<a href="{{ page.inputPath | pathToGitHub }}" title="Edit">Edit</a>

But when I then move this filter into a module and import and add the filter like this:

import filters from "./_config/filters.js";
.
.
export default async function(eleventyConfig) {
    eleventyConfig.addFilter("pathToGitHub", filters.folderList);

I get this error when using the filter to create the edit link above:

[11ty] 2. (./_layouts/base.njk)
[11ty]   Template render error: (C:\...\eleventy\robin.is\_includes\footer.njk)
[11ty]   Error: ENOTDIR: not a directory, scandir 'C:\...\eleventy\robin.is\pages\home.njk' (via Template render error)

As such this error makes sense, since page.inputPath is not a path to a directory but a file. What I don't understand is why I get this error when putting the filter in a module, but not when leaving it directly in the eleventy config file.

Some further trial and error indicates that it is not related to the filter code itself, because even if that filter does nothing (eg simply return "/") I get the error. I also don't get the error without using the filter, ie simply using this (which is obviously pointless):

<a href="{{ page.inputPath }}" title="Edit">Edit</a>

So the error occurs between the output of page.inputPath and before its input into pathToGitHub, but only when that function is in a module. So there is something in the "module" functionality that I am not understanding.

Any suggestions welcome!

Tagged: