Cleaning up the 11ty config

I read a couple of articles this week on cleaning up your 11ty config file, the initial one that I found from Robin Hoover and the second from Lene Saile in which Lene had added a 3rd method, adding another config file as a plugin which I then understood what I could do. Yes takes me a bit of time sometimes.

I created a new folder named _11ty in my source folder and in that added new .js files for each of the plugins, functions, filters and collections I needed, and in each added the code for them. This included the module.exports section but with slightly changed code.

plugin.js code example:

The module.exports line has changed from:

to

~ module.exports = eleventyConfig => {

With all the plugin and filter code tucked into its own file for convenience and ease of maintenance my .eleventy.js file now looks like this:

module.exports = function(eleventyConfig) { // Plugins eleventyConfig.addPlugin(require("./src/_11ty/cssmini.js")); // CSS minification eleventyConfig.addPlugin(require("./src/_11ty/rss.js")); // RSS feed plugin eleventyConfig.addPlugin(require("./src/_11ty/datetime.js")); // Date Time plugin eleventyConfig.addPlugin(require("./src/_11ty/collections.js")); // Collections eleventyConfig.addPlugin(require("./src/_11ty/image.js")); // Image plugin eleventyConfig.addPlugin(require("./src/_11ty/passthroughs.js")); // passthroughs

return { dir: { input: "src", output: "public" } } }; ~

You can see the paths to each plug in I have used.

Yes, this is more of a note to myself for the next time I need to do this but I hope it helps someone else too!