posthtml-inline-favicon is a PostHTML plugin to inline favicons.
Before:
<head>
<link rel="icon" href="favicon.ico" />
</head>After:
<head>
<link rel="icon" type="image/png" href="data:image/png;base64,..." />
</head># npm
npm i -D posthtml-inline-favicon
# pnpm
pnpm add -D posthtml-inline-favicon
# Yarn
yarn add -D posthtml-inline-faviconconst fs = require("fs");
const posthtml = require("posthtml");
const { inlineFavicon } = require("posthtml-inline-favicon");
const html = fs.readFileSync("./index.html");
posthtml()
.use(inlineFavicon())
.process(html)
.then((result) => fs.writeFileSync("./after.html", result.html));By default, the plugin assumes that the file to process is in the same directory as the posthtml script. If not, specify the relative path to the html file in the options:
const fs = require("fs");
const posthtml = require("posthtml");
const { inlineFavicon } = require("posthtml-inline-favicon");
const html = fs.readFileSync("./public/index.html");
posthtml()
.use(inlineFavicon({ path: "public" }))
.process(html)
.then((result) => fs.writeFileSync("./after.html", result.html));See the PostHTML Guidelines.