add generate favicons script
This commit is contained in:
parent
71e8a120e9
commit
9c45f782ba
2 changed files with 41 additions and 0 deletions
|
|
@ -10,6 +10,7 @@
|
||||||
},
|
},
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"clean": "rimraf dist src/_includes/css src/_includes/scripts",
|
"clean": "rimraf dist src/_includes/css src/_includes/scripts",
|
||||||
|
"favicons": "node ./src/_config/setup/generate-favicons.js",
|
||||||
"screenshots": "node ./src/_config/setup/generate-screenshots.js",
|
"screenshots": "node ./src/_config/setup/generate-screenshots.js",
|
||||||
"dev:11ty": "cross-env ELEVENTY_ENV=development eleventy --serve --watch",
|
"dev:11ty": "cross-env ELEVENTY_ENV=development eleventy --serve --watch",
|
||||||
"build:11ty": "cross-env ELEVENTY_ENV=production eleventy",
|
"build:11ty": "cross-env ELEVENTY_ENV=production eleventy",
|
||||||
|
|
|
||||||
40
src/_config/setup/generate-favicons.js
Normal file
40
src/_config/setup/generate-favicons.js
Normal file
|
|
@ -0,0 +1,40 @@
|
||||||
|
import fs from 'node:fs';
|
||||||
|
import sharp from 'sharp';
|
||||||
|
import {sharpsToIco} from 'sharp-ico';
|
||||||
|
import {pathToSvgLogo} from '../../_data/meta.js';
|
||||||
|
|
||||||
|
async function createFavicons() {
|
||||||
|
const outputDir = 'src/assets/images/favicon';
|
||||||
|
fs.mkdirSync(outputDir, {recursive: true});
|
||||||
|
|
||||||
|
// Get the SVG logo
|
||||||
|
const svgBuffer = fs.readFileSync(pathToSvgLogo);
|
||||||
|
|
||||||
|
// SVG icon
|
||||||
|
fs.writeFileSync(`${outputDir}/favicon.svg`, svgBuffer);
|
||||||
|
|
||||||
|
// PNG icons
|
||||||
|
await sharp(svgBuffer).resize(192, 192).toFile(`${outputDir}/icon-192x192.png`);
|
||||||
|
await sharp(svgBuffer).resize(512, 512).toFile(`${outputDir}/icon-512x512.png`);
|
||||||
|
await sharp(svgBuffer).resize(180, 180).toFile(`${outputDir}/apple-touch-icon.png`);
|
||||||
|
|
||||||
|
// maskable icon
|
||||||
|
await sharp(svgBuffer)
|
||||||
|
.resize(512, 512)
|
||||||
|
.extend({
|
||||||
|
top: 50,
|
||||||
|
bottom: 50,
|
||||||
|
left: 50,
|
||||||
|
right: 50,
|
||||||
|
background: {r: 0, g: 0, b: 0, alpha: 0} // Transparent padding
|
||||||
|
})
|
||||||
|
.toFile(`${outputDir}/maskable-icon.png`);
|
||||||
|
|
||||||
|
// ICO icon
|
||||||
|
const iconSharp = sharp(svgBuffer).resize(16, 16);
|
||||||
|
await sharpsToIco([iconSharp], `${outputDir}/favicon.ico`, {sizes: [16]});
|
||||||
|
|
||||||
|
console.log('All favicons generated.');
|
||||||
|
}
|
||||||
|
|
||||||
|
createFavicons();
|
||||||
Loading…
Reference in a new issue