美文网首页我爱编程
使用VUE框架,icon不显示的问题

使用VUE框架,icon不显示的问题

作者: yguang94 | 来源:发表于2018-06-11 11:31 被阅读0次
    将原生的代码用vue框架来做,出现种种问题,之前设置小图标的时候也出现了问题,总结了网上的解决方案,在此记下对我亲自试验并奏效的方案

    前提是favico.ico放到根目录(就是src同级的目录),与原生代码不同的是还需要在build/webpack.dev.conf.js文件配置:

    1.webpack.dev.conf.js文件里plugins里加入这段代码: favicon: './favicon.ico'

    new HtmlWebpackPlugin({
          filename: 'index.html',
          template: 'index.html',
          inject: true,
          favicon: './favicon.ico'      //这里哦
        })
    

    2.在index.html中引入代码:

    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" rel="external nofollow">
    

    3.修改完配置文件需要重新npm run dev才可以奏效

    关于谷歌浏览器不显示小图标: 是缓存问题,手动强制刷新一下试试(ctrl+F5)
    注:( 也有把favicon放入static文件夹下的,因为我没有奏效,所以用了这个方法,如果放入static的话只要改一下favicon的路径就可以。)

    相关文章

      网友评论

        本文标题:使用VUE框架,icon不显示的问题

        本文链接:https://www.haomeiwen.com/subject/rdgceftx.html