vue小图标favicon不显示的解决方案
vue脚手架虽然好用,但是文件配置问题一直很头疼。
将原生的代码用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 添加axios组件,解决post传参数为null的问题
下面小编就为大家分享一篇基于vue 添加axios组件,解决post传参数为null的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧2018-03-03
快速解决electron-builder打包时下载依赖慢的问题
使用 Electron-builder 打包,有时会在下载Electron、nsis、winCodeSign的过程中 Timeout 导致打包失败,本文给大家分享快速解决electron-builder打包时下载依赖慢的问题,感兴趣的朋友一起看看吧2024-02-02
vue3 + vite + ts 中使用less文件全局变量的操作方法
这篇文章主要介绍了vue3 + vite + ts 中使用less文件全局变量的操作方法,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧2024-03-03


最新评论