Question

在使用vue脚手架时为什么不能加载favicon.ico图标

Answer 1

你是怎么写的？ favicon.ico 图片有两种情况，一种是直接把图标文件放在站点根目录下，这种情况下页面中不需要写任何内容，支持ico图标的浏览器会自动读取到。
一种是图标文件不在根目录，而是在特定的文件夹下，这种情况需要使用 link 标签来引入，href 属性中写路径地址。
如果你使用的是第二种情况的话，使用 vue 脚手架生成项目之后，手动修改一下 index.html 文件，把 link 标签加上应该就没问题了。

Answer 2

将你的 favicon.ico 放在static文件里 ， 在webpack.dev.conf.js 中写成

new HtmlWebpackPlugin({

filename: 'index.html',

template: 'index.html',

inject: true,

favicon: './static/favicon.ico'

})

index.html里添加

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

dev环境 和build 后都能看到你的favicon.ico