vue3更换浏览器地址栏的 favicon.ico图标

介绍

vue 项目中,修改浏览器地址栏中的 icon 图标,默认是在根目录 index.html中进行修改的。
但是在 vue3以上版本中, 直接替换这个 favicon.ico图标是无法生效的。

解决方式

  1. 找到 index.html根文件
    vue3更换浏览器地址栏的 favicon.ico图标_第1张图片
  2. 找到项目下的 public 文件夹,复制自己的favicon.ico 图标到该文件夹下;如下所示:
    vue3更换浏览器地址栏的 favicon.ico图标_第2张图片
  3. index.html 根文件夹中,修改 icon的路径;当前目录下的 /public/favicon.ico即可;
    vue3更换浏览器地址栏的 favicon.ico图标_第3张图片
    总结:在vue3 中,网页把根域名作为相对路径的根目录了,而我们文件的路径是相对于项目文件的根目录的,所以设置绝对路径即可。

你可能感兴趣的:(Vue3.2,前端,vue3,vue.js)