Unable to change Favicon in newest SvelteKit version #11157
Replies: 4 comments 1 reply
|
Hello @ucheNkadiCode |
|
@ucheNkadiCode Your <!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
%sveltekit.head%
</head>
<body data-sveltekit-preload-data="hover">
<div style="display: contents">%sveltekit.body%</div>
</body>
</html> |
|
@ucheNkadiCode As far as the |
|
they're putting it in src/lib/assets, importing it in the root layout and applying it with <svelte:head>, which injects as an SVG within %sveltekit.head% in app.html. update the import in routes/+layout.svelte to fix it |
...update it to what? I'm seeing this same problem - my svg favicon works/loads, but there is a 404 searching for favicon.ico on every page load too. |
Uh oh!
There was an error while loading. Please reload this page.
Uh oh!
There was an error while loading. Please reload this page.
My package JSON
{ "name": "WEBSITE_NAME", "version": "0.0.1", "private": true, "scripts": { "dev": "vite dev", "build": "vite build", "preview": "vite preview", "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json", "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch", "lint": "prettier --check .", "format": "prettier --write ." }, "devDependencies": { "@sveltejs/adapter-auto": "^2.0.0", "@sveltejs/kit": "^1.27.4", "prettier": "^3.0.0", "prettier-plugin-svelte": "^3.0.0", "svelte": "^4.2.7", "svelte-check": "^3.6.0", "tslib": "^2.4.1", "typescript": "^5.0.0", "vite": "^4.4.2" }, "type": "module" }My app.html file is such
I've tried what feels like everything and used favicon.io to create my images. I then created a favicon folder in the static folder which should work, but nothing is working. I've also tried moving these links into svelte:head but that didn't work either.
Am I missing something? Could it be an issue in the
svelte.config.jsfile? It's not working locally nor on the deployed website.All reactions