vue打包之后浏览器图标设置直接没有输出，vue打包之后浏览器图标不显示

最新推荐文章于 2024-04-10 12:39:36 发布

小_宋

最新推荐文章于 2024-04-10 12:39:36 发布

阅读量825

点赞数 1

分类专栏： vue 文章标签： vue.js javascript

本文链接：https://blog.csdn.net/weixin_43779406/article/details/112475827

版权

vue 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

打包之前的部分index.html


<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <title>xxxx</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0">
    <-- 可以看到有设置浏览器图标 -->
    <link rel="icon" href="<%= BASE_URL %>favicon.ico" type="image/x-icon" /> 
    <link rel="stylesheet" name="theme" href="">    
</head>
</html>

打包之后的部分index.html，可以看到打包之后并没有输出设置浏览器图标的那行代码

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <title>xxxx</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0">
    <link rel="stylesheet" name="theme" href="">
     <-- 打包之后并没有设置浏览器图标的代码 -->
</head>
</html>

检查发现，是模板中的 ejs 文件没有设置,加一行代码，路径根据自己项目编写即可

<link rel="icon" href="xxxxx" type="image/x-icon" />

然后再重新打包，可以看到打包之后的输出中有设置浏览器图标的代码，放在服务器可以正确显示图标
如果图标在 network 中加载了，但是查看之后发现是走了接口，显示 token 无效之类的，可以让后端设置 jwt，过滤掉图标

小_宋

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
打赏
3
评论
vue打包之后浏览器图标设置直接没有输出，vue打包之后浏览器图标不显示

打包之前的部分index.html<!DOCTYPE html><html lang="zh-CN"><head> <title>xxxx</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalabl.
复制链接

扫一扫