From 4977f1dcd4109a4f91fc424828bd006704de824b Mon Sep 17 00:00:00 2001 From: madrilene Date: Mon, 3 Jun 2024 11:05:16 +0200 Subject: [PATCH] update imports, use esm, new syntax --- eleventy.config.js | 202 +++++++++++++++++++-------------------------- 1 file changed, 84 insertions(+), 118 deletions(-) diff --git a/eleventy.config.js b/eleventy.config.js index 6b91594..7d866b0 100644 --- a/eleventy.config.js +++ b/eleventy.config.js @@ -1,62 +1,34 @@ /** - * I try to keep the `eleventy.config.js` file clean and uncluttered. Most adjustments must be made in: - * - `./config/collections/index.js` - * - `./config/filters/index.js` - * - `./config/plugins/index.js` - * - `./config/shortcodes/index.js` - * - `./config/transforms/index.js` + * Most adjustments must be made in `./src/_config/*` + */ + +/** + * Configures Eleventy with various settings, collections, plugins, filters, shortcodes, and more. + * Hint VS Code for eleventyConfig autocompletion. + * © Henry Desroches - https://gist.github.com/xdesro/69583b25d281d055cd12b144381123bf + * @param {import("@11ty/eleventy/src/UserConfig")} eleventyConfig - + * @returns {Object} - */ // register dotenv for process.env.* variables to pickup -require('dotenv').config() +import dotenv from 'dotenv'; +dotenv.config(); -// JSDoc comment: Hint VS Code for eleventyConfig autocompletion. © Henry Desroches - https://gist.github.com/xdesro/69583b25d281d055cd12b144381123bf +// add yaml support +import yaml from 'js-yaml'; -/** - * @param {import("@11ty/eleventy/src/UserConfig")} eleventyConfig - */ +// config import +import {getAllPosts, onlyMarkdown, tagList} from './src/_config/collections.js'; +import events from './src/_config/events.js'; +import filters from './src/_config/filters.js'; +import plugins from './src/_config/plugins.js'; +import shortcodes from './src/_config/shortcodes.js'; -// module import filters -const { - toISOString, - formatDate, - toAbsoluteUrl, - stripHtml, - minifyCss, - minifyJs, - splitlines, - shuffleArray -} = require('./config/filters/index.js'); +export default async function (eleventyConfig) { + eleventyConfig.addWatchTarget('./src/assets/**/*.{css,js,svg,png,jpeg}'); + eleventyConfig.addWatchTarget('./src/_includes/**/*.{webc}'); -// module import shortcodes -const {imageShortcode, includeRaw, liteYoutube} = require('./config/shortcodes/index.js'); - -// module import collections -const {getAllPosts} = require('./config/collections/index.js'); -const {onlyMarkdown} = require('./config/collections/index.js'); -const {tagList} = require('./config/collections/index.js'); - -// module import events -const {svgToJpeg} = require('./config/events/index.js'); - -// plugins - -const {EleventyRenderPlugin} = require('@11ty/eleventy'); -const pluginRss = require('@11ty/eleventy-plugin-rss'); -const inclusiveLangPlugin = require('@11ty/eleventy-plugin-inclusive-language'); -const bundlerPlugin = require('@11ty/eleventy-plugin-bundle'); -const syntaxHighlight = require('@11ty/eleventy-plugin-syntaxhighlight'); - -const markdownLib = require('./config/plugins/markdown.js'); -const {slugifyString} = require('./config/utils/index.js'); -const yaml = require('js-yaml'); - -module.exports = eleventyConfig => { - // --------------------- Custom Watch Targets ----------------------- - eleventyConfig.addWatchTarget('./src/assets'); - eleventyConfig.addWatchTarget('./utils/*.js'); - - // --------------------- layout aliases ----------------------- + // --------------------- layout aliases eleventyConfig.addLayoutAlias('base', 'base.njk'); eleventyConfig.addLayoutAlias('home', 'home.njk'); eleventyConfig.addLayoutAlias('page', 'page.njk'); @@ -64,80 +36,74 @@ module.exports = eleventyConfig => { eleventyConfig.addLayoutAlias('post', 'post.njk'); eleventyConfig.addLayoutAlias('tags', 'tags.njk'); - // --------------------- Custom filters ----------------------- - eleventyConfig.addFilter('toIsoString', toISOString); - eleventyConfig.addFilter('formatDate', formatDate); - eleventyConfig.addFilter('toAbsoluteUrl', toAbsoluteUrl); - eleventyConfig.addFilter('stripHtml', stripHtml); - eleventyConfig.addFilter('slugify', slugifyString); - eleventyConfig.addFilter('splitlines', splitlines); - eleventyConfig.addFilter('shuffle', shuffleArray); - - eleventyConfig.addFilter('cssmin', minifyCss); - eleventyConfig.addNunjucksAsyncFilter('jsmin', minifyJs); - - eleventyConfig.addFilter('toJson', JSON.stringify); - eleventyConfig.addFilter('fromJson', JSON.parse); - - eleventyConfig.addFilter('keys', Object.keys); - eleventyConfig.addFilter('values', Object.values); - eleventyConfig.addFilter('entries', Object.entries); - - // --------------------- Custom shortcodes --------------------- - eleventyConfig.addNunjucksAsyncShortcode('eleventyImage', imageShortcode); - eleventyConfig.addShortcode('youtube', liteYoutube); - eleventyConfig.addShortcode('include_raw', includeRaw); - eleventyConfig.addShortcode('year', () => `${new Date().getFullYear()}`); // current year, by stephanie eckles - - // --------------------- Custom transforms --------------------- - eleventyConfig.addPlugin(require('./config/transforms/html-config.js')); - - // --------------------- Custom Template Languages --------------------- - eleventyConfig.addPlugin(require('./config/template-languages/css-config.js')); - eleventyConfig.addPlugin(require('./config/template-languages/js-config.js')); - - // --------------------- Custom collections ----------------------- - eleventyConfig.addCollection('posts', getAllPosts); + // --------------------- Collections + eleventyConfig.addCollection('allPosts', getAllPosts); eleventyConfig.addCollection('onlyMarkdown', onlyMarkdown); eleventyConfig.addCollection('tagList', tagList); - // --------------------- Events --------------------- - if (process.env.ELEVENTY_RUN_MODE === 'serve') { - // this only runs in development, on your machine, so og images get installed fonts. - eleventyConfig.on('eleventy.after', svgToJpeg); - } + // --------------------- Plugins + eleventyConfig.addPlugin(plugins.htmlConfig); + eleventyConfig.addPlugin(plugins.cssConfig); + eleventyConfig.addPlugin(plugins.jsConfig); - // --------------------- Plugins --------------------- - eleventyConfig.addPlugin(EleventyRenderPlugin); - eleventyConfig.addPlugin(syntaxHighlight); - eleventyConfig.addPlugin(pluginRss); - eleventyConfig.addPlugin(inclusiveLangPlugin); - eleventyConfig.addPlugin(bundlerPlugin); - eleventyConfig.setLibrary('md', markdownLib); + eleventyConfig.addPlugin(plugins.EleventyRenderPlugin); + eleventyConfig.addPlugin(plugins.rss); + eleventyConfig.addPlugin(plugins.syntaxHighlight); - // Add support for YAML data files with .yaml extension - eleventyConfig.addDataExtension('yaml', contents => yaml.load(contents)); - - // --------------------- Passthrough File Copy ----------------------- - // same path - ['src/assets/fonts/', 'src/assets/images/template', 'src/assets/og-images'].forEach( - path => eleventyConfig.addPassthroughCopy(path) - ); - - // to root - eleventyConfig.addPassthroughCopy({ - 'src/assets/images/favicon/*': '/' + eleventyConfig.addPlugin(plugins.webc, { + components: ['./src/_includes/webc/*.webc'], + useTransform: true }); - // --------------------- general config ----------------------- - return { - // Pre-process *.md, *.html and global data files files with: (default: `liquid`) - markdownTemplateEngine: 'njk', - htmlTemplateEngine: 'njk', - dataTemplateEngine: 'njk', + // --------------------- bundle + eleventyConfig.addBundle('css', {hoist: true}); - // Optional (default is set): If your site deploys to a subdirectory, change `pathPrefix`, for example with with GitHub pages - pathPrefix: '/', + // --------------------- Library and Data + eleventyConfig.setLibrary('md', plugins.markdownLib); + eleventyConfig.addDataExtension('yaml', contents => yaml.load(contents)); + + // --------------------- Filters + eleventyConfig.addFilter('toIsoString', filters.toISOString); + eleventyConfig.addFilter('formatDate', filters.formatDate); + eleventyConfig.addFilter('markdownFormat', filters.markdownFormat); + eleventyConfig.addFilter('splitlines', filters.splitlines); + eleventyConfig.addFilter('striptags', filters.striptags); + eleventyConfig.addFilter('shuffle', filters.shuffleArray); + eleventyConfig.addFilter('alphabetic', filters.sortAlphabetically); + eleventyConfig.addFilter('toAbsoluteUrl', filters.toAbsoluteUrl); + eleventyConfig.addFilter('slugify', filters.slugifyString); + + // --------------------- Shortcodes + eleventyConfig.addShortcode('svg', shortcodes.svgShortcode); + eleventyConfig.addShortcode('image', shortcodes.imageShortcode); + eleventyConfig.addShortcode('year', () => `${new Date().getFullYear()}`); + + // --------------------- Events --------------------- + if (process.env.ELEVENTY_RUN_MODE === 'serve') { + eleventyConfig.on('eleventy.after', events.svgToJpeg); + } + + // --------------------- Passthrough File Copy + + // -- same path + ['src/assets/fonts/', 'src/assets/images/template', 'src/assets/og-images'].forEach(path => + eleventyConfig.addPassthroughCopy(path) + ); + + eleventyConfig.addPassthroughCopy({ + // -- to root + 'src/assets/images/favicon/*': '/', + + // -- node_modules + 'node_modules/lite-youtube-embed/src/lite-yt-embed.{css,js}': `assets/components/` + }); + + // --------------------- Build Settings + eleventyConfig.setDataDeepMerge(true); + + // --------------------- general config + return { + markdownTemplateEngine: 'njk', dir: { output: 'dist', @@ -146,4 +112,4 @@ module.exports = eleventyConfig => { layouts: '_layouts' } }; -}; +}