Optional icon generator by generateIcons option

.changeset/safari-unstaffed-strive.md

@@ -0,0 +1,5 @@
+---
+"@chialab/esbuild-plugin-html": patch
+---
+
+Introduce `generateFavicons` config.

docs/guide/esbuild-plugin-html.md

@@ -102,6 +102,11 @@ An array of extensions to consider as HTML entrypoints.
 
 A function to preprocess the HTML content before parsing it.
 
+#### `generateFavicons`
+
+Enable or disable the generation of the favicons.
+It can be `true` (default) or `false`.
+
 ## How it works
 
 **Esbuild Plugin HTML** instructs esbuild to load a HTML file as entrypoint. It parses the HTML and runs esbuild on scripts, styles, assets and icons.
@@ -180,6 +185,8 @@ This will result in:
 
 Manually generate favicons can be a pain. This plugin detects a `<link rel="icon">` node and uses its reference to generate icons and launch screens for (almost) every browser.
 
+This step can be disabled by setting the option `generateFavicons` to `false`.
+
 **Sample**
 
 ```html

packages/esbuild-plugin-html/lib/collectIcons.js

@@ -89,7 +89,7 @@ async function generateAppleIcons(image, icons) {
  * @param {Icon} icon The generated icon file.
  * @param {string} rel Rel attribute.
  * @param {boolean} shortcut Should include shortcut.
- * @param {import('./index.js').BuildOptions} options Build options.
+ * @param {import('./index.js').CollectOptions<{ generateFavicons: boolean }>} options Build options.
  * @param {import('./index.js').Helpers} helpers Helpers.
  * @returns {Promise<import('@chialab/esbuild-rna').OnTransformResult>} Plain build.
  */
@@ -173,11 +173,15 @@ async function collectAppleIcons($, dom, options, helpers) {
 
 /**
  * Collect and bundle favicons.
- * @type {import('./index').Collector<{}>}
+ * @type {import('./index').Collector<{ generateFavicons: boolean }>}
  */
 export async function collectIcons($, dom, options, helpers) {
     const { resolve, load } = helpers;
 
+    if (!options.generateFavicons) {
+        return [];
+    }
+
     const iconElement = dom.find(ICON_SELECTORS.join(',')).last();
     if (!iconElement.length) {
         return [];

packages/esbuild-plugin-html/lib/index.js

@@ -18,6 +18,7 @@ import beautify from 'js-beautify';
  * @property {string} [assetNames]
  * @property {string[]} [extensions]
  * @property {'link' | 'script'} [injectStylesAs]
+ * @property {boolean} [generateFavicons]
  * @property {import('htmlnano').HtmlnanoOptions} [minifyOptions]
  * @property {(code: string, path: string) => string | Promise<string>} [preprocess]
  */
@@ -65,6 +66,7 @@ export default function ({
     injectStylesAs = 'script',
     extensions = ['.html'],
     preprocess = (code) => code,
+    generateFavicons = true,
 } = {}) {
     /**
      * @type {import('esbuild').Plugin}
@@ -246,6 +248,7 @@ export default function ({
                         outDir: /** @type {string} */ (build.getFullOutDir()),
                         entryDir: build.resolveOutputDir(args.path),
                         target: [scriptsTarget, modulesTarget],
+                        generateFavicons,
                     };
 
                     /**

packages/esbuild-plugin-html/test/test.spec.js

@@ -967,6 +967,47 @@ html {
         expect(icons[3].contents.byteLength).toBe(6366);
     });
 
+    test('should not generate favicons', async () => {
+        const { outputFiles } = await esbuild.build({
+            absWorkingDir: fileURLToPath(new URL('.', import.meta.url)),
+            entryPoints: [fileURLToPath(new URL('fixture/index.icons.html', import.meta.url))],
+            sourceRoot: '/',
+            assetNames: 'icons/[name]',
+            outdir: 'out',
+            format: 'esm',
+            bundle: true,
+            write: false,
+            plugins: [
+                htmlPlugin({
+                    generateFavicons: false,
+                }),
+            ],
+        });
+
+        const [index, ...icons] = outputFiles;
+
+        expect(outputFiles).toHaveLength(1);
+
+        expect(index.path).endsWith(path.join(path.sep, 'out', 'index.icons.html'));
+        expect(index.text).toBe(`<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <link rel="shortcut icon" href="img/icon.png" type="image/png">
+</head>
+
+<body>
+</body>
+
+</html>`);
+
+        expect(icons).toHaveLength(0);
+    });
+
     test('should bundle webapp with svg favicon', async () => {
         const { outputFiles } = await esbuild.build({
             absWorkingDir: fileURLToPath(new URL('.', import.meta.url)),