每個網站都有自己的圖標（favicon），除了便于識別與書簽收藏，也是一個廠牌吧。瀏覽器可以將favicon顯示于瀏覽器的地址欄中，也可置于書簽列表的網站名前，還可以放在標簽式瀏覽界面中的頁標題前。
但是我們自己的網站，例如博客怎么設置這個圖標（favicon）呢？
首先我們準備好自己的favicon即favicon.ico，一般是16x16像素或者32x32像素，一般在保證favicon清晰度的情況下越小越好，有利于提升網站速率。
制作favicon有很多在線的網站，找合適的即可。
- 情況1:使用vue-cli方法初始化的項目結構
image.png
我們找到圖中的文件，將其中的代碼加一句favicon的設置，如下:
new HtmlWebpackPlugin({
filename: config.build.index,
template: 'index.html',
inject: true,
favicon: path.resolve('favicon.ico'),
...
}),
具體原因可以參考HtmlWebpackPlugin插件的屬性：https://github.com/jantimon/html-webpack-plugin#configuration
- 情況2:使用nodejs設置，在服務端設置favicon
只需一句話即可，如下：
app.use(favicon(path.join(__dirname, 'public/images', 'favicon.ico')));
- 情況3:使用link標簽設置
<link rel="shortcut icon" href="/favicon.ico" />
<link rel="bookmark" href="/favicon.ico" type="image/x-icon" />
關于這種方法更具體的知識和解釋可以參考：
https://zhangge.net/4344.html
