vite-pwa
Duplicate classes in PWA icon link tags bloating HTML output
When using this Astro integration with pnpm, I've noticed that the generated HTML output contains multiple duplicate classes in the PWA icon link tags, significantly increasing the size of the build artifacts.
Steps to Reproduce:
- Use examples/pwa-simple-assets-generator
- Edit
package.json(since pnpm requires explicit installation of all packages used in the code)
{
"devDependencies": {
"@vite-pwa/assets-generator": "^1.0.0",
"@vite-pwa/astro": "^1.0.1",
"astro": "^5.7.4",
"vite-plugin-pwa": "^1.0.0",
"workbox-window": "^7.3.0"
}
}
- Install dependencies
- Build with pnpm
Actual Result:
The generated dist/index.html contains link tags with numerous repeated classes like:
<html lang="en" data-astro-cid-qup72gqn>
<head>
<link href="/favicon.ico" rel="icon" sizes="48x48" class="astro-qup72gqn astro-qup72gqn astro-qup72gqn astro-qup72gqn astro-qup72gqn">
<link href="/favicon.svg" rel="icon" sizes="any" type="image/svg+xml" class="astro-qup72gqn astro-qup72gqn astro-qup72gqn astro-qup72gqn astro-qup72gqn">
...
</head>
...
</html>
Each PWA icon link tag has the same class astro-qup72gqn repeated 5 times, which unnecessarily increases the HTML file size. In fact, in my personal project, these duplicate classes appeared 21 times in each PAW icon link tag.
Expected Result:
Each class should only appear once per link tag or no class at all.
I guess the problem can be solved just adding a key (using the icon name) to the icons links
