.eleventy.js

const yaml = require("js-yaml");
const { DateTime } = require("luxon");
const htmlmin = require("html-minifier");
const { EleventyRenderPlugin } = require("@11ty/eleventy");
const CleanCSS = require("clean-css");
const fs = require("fs");
const NOT_FOUND_PATH = "_site/404.html";

module.exports = function (eleventyConfig) {
  eleventyConfig.setBrowserSyncConfig({
    callbacks: {
      ready: function (err, bs) {

        bs.addMiddleware("*", (req, res) => {
          if (!fs.existsSync(NOT_FOUND_PATH)) {
            throw new Error(`Expected a \`${NOT_FOUND_PATH}\` file but could not find one. Did you create a 404.html template?`);
          }

          const content_404 = fs.readFileSync(NOT_FOUND_PATH);
          // Add 404 http status code in request header.
          res.writeHead(404, { "Content-Type": "text/html; charset=UTF-8" });
          // Provides the 404 content without redirect.
          res.write(content_404);
          res.end();
        });
      }
    }
  });

  // Disable automatic use of your .gitignore
  eleventyConfig.setUseGitIgnore(false);

  // Merge data instead of overriding
  eleventyConfig.setDataDeepMerge(true);

  // human readable date
  eleventyConfig.addFilter("readableDate", (dateObj) => {
    return DateTime.fromJSDate(dateObj, { zone: "utc" }).toFormat(
      "dd LLL yyyy"
    );
  });

  eleventyConfig.addFilter("cssmin", function (code) {
    return new CleanCSS({}).minify(code).styles;
  });

  eleventyConfig.addPlugin(EleventyRenderPlugin);

  // To Support .yaml Extension in _data
  // You may remove this if you can use JSON
  eleventyConfig.addDataExtension("yaml", (contents) => yaml.load(contents));

  // Copy Static Files to /_Site
  eleventyConfig.addPassthroughCopy({
    "./src/admin/config.yml": "./admin/config.yml",
    "node_modules/lightgallery/css/lightgallery.css":          "./static/css/lightgallery.css",
    "node_modules/lightgallery/lightgallery.umd.js":           "./static/js/lightgallery/lightgallery.umd.js",
    "node_modules/lightgallery/plugins/video/lg-video.umd.js": "./static/js/lightgallery/lg-video.umd.js",
    "node_modules/lightgallery/fonts/lg.woff2":                "./static/fonts/lg.woff2",
    "node_modules/minimasonry/build/minimasonry.esm.js":       "./static/js/minimasonry.esm.js"
  });

  // Copy Image Folder to /_site
  eleventyConfig.addPassthroughCopy("./src/static");

  // Copy favicon to route of /_site
  eleventyConfig.addPassthroughCopy("./src/favicon.ico");


  eleventyConfig.addShortcode("vimeo", function (url, title) {
    const regExp = /^.*(vimeo\.com\/)((channels\/[A-z]+\/)|(groups\/[A-z]+\/videos\/))?([0-9]+)/;
    const parseUrl = regExp.exec(url);

    return `<iframe
              class="vimeo"
              src="https://player.vimeo.com/video/${parseUrl[5]}"
              frameborder="0"
              allow="autoplay; fullscreen; picture-in-picture"
              allowfullscreen
              title="${title}"
            ></iframe>`
  });

  eleventyConfig.addShortcode("youtube", (url, title) => {
    const regExp = /(?:https?:)?(?:\/\/)?(?:[0-9A-Z-]+\.)?(?:youtu\.be\/|youtube(?:-nocookie)?\.com\S*?[^\w\s-])([\w-]{11})(?=[^\w-]|$)(?![?=&+%\w.-]*(?:['"][^<>]*>|<\/a>))[?=&+%\w.-]*/;
    const parseUrl = regExp.exec(url);

    return `<iframe 
              class="youtube" 
              src="https://www.youtube-nocookie.com/embed/${parseUrl[1]}" 
              title="${title}" 
              frameborder="0" 
              allowfullscreen
            ></iframe>`;
  });

  // Minify HTML
  eleventyConfig.addTransform("htmlmin", function (content, outputPath) {
    // Eleventy 1.0+: use this.inputPath and this.outputPath instead
    if (outputPath.endsWith(".html")) {
      let minified = htmlmin.minify(content, {
        useShortDoctype: true,
        removeComments: true,
        collapseWhitespace: true,
      });
      return minified;
    }

    return content;
  });

  // Let Eleventy transform HTML files as nunjucks
  // So that we can use .html instead of .njk
  return {
    dir: {
      input: "src",
    },
    htmlTemplateEngine: "liquid",
  };
};