在vue中添加ico图标

时间:2021-11-05 02:30:52

准备:添加 ico图标在与index.html同级的目录

  1. 第一种方法:

    index.html中引入:

    <link rel="shortcuticon" type="image/x-icon" href="./favicon.ico" />
  2. 第二种方法

    webpack.dev.conf.js目录找到pluginsnew HtmlWebpackPlugin中添加

    favicon: './favicon.ico'

    效果如下:

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

    第二种方法的基础上还是无法显示,可以在webpack.prod.conf.js的相同位置添加favicon: './favicon.ico'

    3 . 一般两种方法择其一就好,修改配置之后要重新run 一下,查看网页源代码有配置ico的代码就对了;如果一直不对的话,清缓存

    ​ 重启电脑就好;