site/plugins/manifest-icons/index.js

const sharp = require('sharp')
const fs = require('fs').promises
const getDirName = require('path').dirname

async function writeFile (path, contents, cb) {
  await fs.mkdir(getDirName(path), { recursive: true })
  fs.writeFile(path, contents, cb)
}

function generatePngFavicon ({ density, width, height }, sourcePath, dimension) {
  return sharp(sourcePath, {
    density: (dimension / Math.max(width, height)) * density
  })
    .resize(dimension, dimension)
    .png()
    .toBuffer()
}

module.exports = (eleventyConfig) => {
  eleventyConfig.addAsyncShortcode('manifest_icons', async function (faviconFile, ...dimensions) {
    const metadata = await sharp(faviconFile).metadata()

    const res = await Promise.all(dimensions.map(async dimension => {
      const favicon = await generatePngFavicon(metadata, faviconFile, dimension)
      writeFile(`dist/icons/${dimension}/favicon.png`, favicon)

      return {
        src: `/icons/${dimension}/favicon.png`,
        sizes: `${dimension}x${dimension}`,
        type: 'image/png'
      }
    }))

    res[res.length - 1].purpose = 'maskable'

    return JSON.stringify(res)
  })
}