一.首先可以使用在线工具将普通png或jpg转化为ico图标。
工具地址：https://www.bitbug.net/?rsv_upd=1
推荐使用3232或者4848，16*16比较模糊。
二.保证根目录index.html里面有ico设置，如：
<link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" rel="external nofollow" />
三.在vue工程目录build文件夹下webpack.dev.conf.js与webpack.prod.conf.js文件中的HtmlWebpackPlugin中添加一条favicon:'favicon文件的相对路径’。
1.favicon内填写路径一定要是相对路径
2.修改的文件，dev是开发环境下，prod是生产环境下，两个都进行修改才能保证本地和通过服务器访问都有小图标
如：
new HtmlWebpackPlugin({
filename: 'index.html',
template: 'index.html',
inject: true,
favicon: './favicon.ico' //此处是ico配置项
})
来源：http://www.qubiancheng1024.com/details/623fc6c68fe8934aa4300888
网友评论