vue小图标favicon不显示怎么办
程序员文章站
2022-04-03 15:27:03
...
vue脚手架虽然好用,但是文件配置问题一直很头疼。本文主要和大家介绍vue小图标favicon不显示的解决方案,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧,希望能帮助到大家。
将原生的代码用vue框架来做,出现种种问题,之前设置小图标的时候也出现了问题,总结了网上的解决方案,在此记下对我亲自试验并奏效的方案:
我是直接将favico.ico丢到根目录(就是src同级的目录),然后进行在build/webpack.dev.conf.js文件配置
1.webpack.dev.conf.js文件里plugins里加入这段代码
new HtmlWebpackPlugin({ filename: 'index.html', template: 'index.html', inject: true, favicon: './favicon.ico' })
添加完代码是这样的:
2.在index.html中引入代码:
<link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" rel="external nofollow" />
3.修改完配置文件记得重新npm run dev才会奏效
关于谷歌浏览器不显示小图标: 是缓存问题,手动强制刷新一下试试(ctrl+F5)
注:( 也有把favicon放入static文件夹下的,因为我没有奏效,所以用了这个方法,如果放入static的话只要改一下favicon的路径就可以。)
相关推荐:
以上就是vue小图标favicon不显示怎么办的详细内容,更多请关注其它相关文章!
推荐阅读
-
解决Vue 项目打包后favicon无法正常显示的问题
-
win7远程桌面连接总显示凭证不工作怎么办?
-
pr扬声器不工作怎么办? pr音频硬件扬声器显示不工作的解决办法
-
当使用vue的按键修饰符不起效果的时候怎么办?如@keyup.enter = '' ;
-
vue数据更新UI不刷新显示的解决办法
-
解决Vue 项目打包后favicon无法正常显示的问题
-
vue小图标favicon不显示的解决方案
-
vue-directive-ellipsis 超过内容显示省略号并出现tooltip,不超过时则都没有
-
vue-awesome-swiper分页不显示怎么办?
-
vue favicon.ico正确显示教程(代码)