Angular Favicon Not Showing? Here's the Fix
Angular copies static files only if the build configuration tells it to. An icon that isn't matched by the assets entry in angular.json never reaches dist. The build succeeds and the file isn't there.
The assets array decides what exists
Every other framework copies a whole directory by convention. Angular does it by configuration: the build target's assets entry copies only what it matches. Newer scaffolds point it at a public/ directory with a glob; older ones list individual paths, starting with src/favicon.ico.
Nothing warns you when this is wrong. Add apple-touch-icon.png next to a working favicon.ico in an older project and it builds cleanly, then 404s in production: favicon.ico was listed by name and your new file was not.
The assets glob (newer scaffolds)
"assets": [
{ "glob": "**/*", "input": "public" }
]Anything in public/ is copied. In an older project the array holds strings like "src/favicon.ico", and you add one line per icon.
Angular favicon not showing: FAQ
Why is my Angular favicon not showing?
The icon isn't matched by the assets entry in angular.json, so it never reached dist. Look in dist/ after ng build. If the file isn't there, add it to the assets array (or the public/ glob) and rebuild.
Why does it 404 under a sub-path?
An href starting with a slash resolves against the domain root. Build with --base-href set to your subdirectory so the base tag in index.html is correct, and write the icon hrefs relative, without a leading slash.
Does @angular/pwa add my icons?
It scaffolds a manifest and placeholder PNG icons and wires the service worker. The icons are placeholders. Replace the image files in place and keep the generated manifest and asset entries.