How to add favicon in vueJS?
February 17, 2023Hi Friends đź‘‹,
Welcome To SortoutCode! ❤️
To add the favicon in vueJS.we are going to add a favicon file in public/index.html in vuejs.
Today I am going to show you How to add a favicon in VueJS?
Table of contains
- Setup the Vue.js
- Add the favicon
Let’s start today’s tutorial How do I add a favicon in VueJS?
Setup the Vue.js
First, we have to install the Vue project, I had installed the vueJS in my system. If you haven’t installed or have any problem with installation you can follow this article, which will show you step by step process of installation.
How to Install the VueJS project?
Add the favicon
To add the favicon file in vue.js project, we are going to use the favicon file with an icon or png extension. And there is one more requirement for the favicon it should be a square shape and also its size should be around 32x32 pixels.
In the public directory add a favicon file and copy the favicon file name and open the public/index.html and go to the <head> section and add the following tag:
<link rel="icon" href="<%= BASE_URL %>favicon.ico">To see the favicon in our project. we need to restart the development server if the server is already running. Now you can see your new favicon.
For now, let’s check the output.
All the best đź‘Ť.