vue设置浏览器顶部小图标

vue 设置网页顶部小图标

1.首先准备一个size为32px(或者其它较小size)的图片

可以去阿里巴巴矢量图网站上面搜索自己喜欢的[地址:](https://www.iconfont.cn/)
或者自己用ps设计自己喜欢的

2.把图片名字改成"favicon.ico"

把改完名字的图片放在项目根目录下面(如下图所示:)

3.找到build文件夹下面的webpack.base.conf.js文件

如图:

然后加上以下内容:
const HtmlWebpackPlugin = require('html-webpack-plugin') //为html文件中引入的外部资源
// 配置在module.exports里面,加小图标操作
  plugins: [
	 new HtmlWebpackPlugin({
	 template: 'index.html',
   	 favicon: 'favicon.ico',
 	 inject: true
	 })
  ],
  如图:

然后重启项目就会看到你想要的小图标啦!