CODEWITHSUNDEEP
vue.jswebpackvue-cli
Question3r
Question3r

Reputation: 3802

completely remove the favicon from Vue app

I currently don't have a favicon for my Vue app and want to remove the default one. I commented out the relevant line in the public/index.html file

<!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" />
    <!-- <link rel="icon" href="<%= BASE_URL %>favicon.ico" /> -->
    <title>My Vue app</title>
  </head>
  <!-- ... body code ... -->
</html>

and run npm run serve. The page still renders the initial favicon. How can I remove it?

Upvotes: 1

Views: 1607

Answers (2)

Jet Ezra
Jet Ezra

Reputation: 174

Actually, after trying to change my favicon and failed, I added this line after inspecting vuejs <link rel="icon" type="image/png" sizes="32x32" href="/img/favicon.png">, whereby, this time, favicon.png was targeting my own image.

Upvotes: 0

JaredMcAteer
JaredMcAteer

Reputation: 22535

Generally when this happens it's one of two things

  1. Most browsers will check for a file called favicon.ico in the root folder and use it even if you don't include it in your head tag.

  2. If the file has been deleted but you had previously opened the website then it's likely just cached in your browser. You can easily check by opening the site in incognito/private browsing mode. Clearing your browser cache for the website will remove it.

Upvotes: 2

Related Questions