Transforming external links in Eleventy

import { parseHTML } from "linkedom";
export default function(content) {
	if (this.page.outputPath && this.page.outputPath.endsWith(".html")) {
		const { document } = parseHTML(content);
		const links = Array.from(document.querySelectorAll("a"));
		links.forEach((link) => {
			const href = link.getAttribute("href");
			const isExternal = href && href.startsWith("http");
			if (isExternal) {
				link.classList.add("external");
				link.setAttribute("target", "_blank");
				link.setAttribute("rel", "noopener noreferrer");
			}
		});
		return "<!DOCTYPE html>\n" + document.documentElement.outerHTML;
	}
	return content;
};

import transformExternalLinks from "./_utils/links.js";
export default async function (config) {
	// ...
	config.addTransform("externalLinks", transformExternalLinks);
}

.external::after {
	background-color: currentcolor;
	content: "\200b"/"(external)";
	display: inline-block;
	height: 1em;
	margin-left: .2em;
	-webkit-mask-image: url(/external.svg);
	mask-image: url(/external.svg);
	-webkit-mask-size: cover;
	mask-size: cover;
	vertical-align: text-top;
	width: 1em;
}