character-ref/eleventy.config.js

89 lines
2.7 KiB
JavaScript

import { env } from 'node:process';
import eleventyPluginNavigation from '@11ty/eleventy-navigation';
import eleventyPluginWebc from '@11ty/eleventy-plugin-webc';
import Image, { eleventyImagePlugin } from '@11ty/eleventy-img';
import htmlminifier from 'html-minifier-terser';
const IMAGE_TRANSFORM_OPTS = {
// Set global default options
formats: ['avif', 'webp', 'auto'],
sharpJpegOptions: { mozjpeg: true, optimiseScans: true, quality: 95 },
sharpPngOptions: { compressionLevel: 9 },
urlPath: '/img/',
// Notably `outputDir` is resolved automatically
// to the project output directory
defaultAttributes: {
loading: 'lazy',
decoding: 'async',
sizes: '(min-width: 64em) 500px, (min-width: 50em) 420px, 375px'
}
};
const BASE = env.ELEVENTY_PRODUCTION ? 'https://ref.sebin-nyshkim.net' : 'http://localhost:8080';
// source: https://notes.jays.net/blog/11ty/
async function getOgImage(src, key) {
const stats = await Image(src, {
width: [1200],
formats: ['webp'],
urlPath: '/img/',
outputDir: './public/img/',
filenameFormat: (hash, src, width, format) => `${hash}-${width}.${format}`
});
if (key === 'url') {
return BASE + stats.webp[0][key];
}
return stats.webp[0][key];
}
export default async function (eleventyConfig) {
eleventyConfig.addWatchTarget('./src/css/');
eleventyConfig.addPassthroughCopy('./src/fonts/');
eleventyConfig.addCollection('sebin', (collection) =>
collection.getFilteredByGlob('./src/sebin/*.md')
);
eleventyConfig.addCollection('viktor', (collection) =>
collection.getFilteredByGlob('./src/viktor/*.md')
);
eleventyConfig.addCollection('jarek', (collection) =>
collection.getFilteredByGlob('./src/jarek/*.md')
);
eleventyConfig.addGlobalData('base', BASE);
eleventyConfig.addTransform('minhtml', function (content) {
if ((this.page.outputPath || '').endsWith('.html')) {
return htmlminifier.minify(content, {
removeEmptyElements: true,
collapseWhitespace: true,
ignoreCustomFragments: [
/<(use|path)[^>]*>(?:(?!<\/(use|path)>)[\s\S])*?<\/(use|path)>/,
/<div[^>]*class="color-box"[^>]*>(?:(?!<\/div>)[\s\S])*?<\/div>/,
/<nav[^>]*class="slider-nav"[^>]*>.*?<\/nav>/
]
});
}
});
eleventyConfig.addFilter('getOgImage', getOgImage);
eleventyConfig.addPlugin(eleventyPluginWebc, {
components: ['src/components/**/*.webc', 'npm:@11ty/eleventy-img/*.webc'],
useTransform: false
});
eleventyConfig.addPlugin(eleventyPluginNavigation);
eleventyConfig.addPlugin(eleventyImagePlugin, IMAGE_TRANSFORM_OPTS);
}
export const config = {
dir: {
input: 'src',
output: 'public',
layouts: 'layouts',
includes: 'includes'
},
markdownTemplateEngine: 'webc'
};