Change favicon Vuejs?

vue.js webpack vue-cli-3
DenisMasot picture DenisMasot · Nov 8, 2018 · Viewed 12.5k times · Source

How to change favicon on Vuejs CLI ?

<link rel="shortcut icon" type="image/png" href="/src/assets/img/logo.png"/>

Answer

tony19 picture tony19 · Nov 9, 2018

Vue CLI (3.0.5) generates projects with the <root>/public directory containing the favicon.ico and index.html (which references the favicon.ico).

It seems you have your icon in <root>/src/assets. I recommend moving it to <root>/public, replacing favicon.ico with jinane-logo-JC.png, and updating index.html accordingly:

<!-- <link rel="icon" href="<%= BASE_URL %>favicon.ico"> --> <!-- REPLACE THIS -->
<link rel="icon" href="<%= BASE_URL %>jinane-logo-JC.png">

Related questions

Vue-Cli: 'title' option for htmlWebpackPlugin does not work

I'm using vue-cli (3.4.1) and I'm trying to simply change the title of the document. I added the following to the vue.config.js chainWebpack: (config) => { config .plugin('html') .tap((args) => { args[0].title = 'Custom Title'; return args; }); }, and inspected …

Read More
Vue cli 3 project alias src to @ or ~/ not working

I have installed the project with vue cli 3 but as the project grows, the import on the components are getting ugly, i end up importing a component like import Component from '../../../../components/folder/Component.vue' i just want to …

Read More
Vuetify Standard Setup (babel/eslint) image failed to load

I'm working on a VueJS project and am trying to load an image on a carousel. I am using the standard setup and have the image in the assets folder. I reference the image URL with <v-carousel-item src="@/assets/…

Read More