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不显示怎么办的详细内容，更多请关注php中文网其它相关文章！
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。
广告![ThinkPHP5快速开发企业站点[全程实录]](https://img.php.cn/upload/course/000/000/068/6253d918a3ce7278.png)
收藏
收藏
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
619
