新的項目用vue-cli3來搭，以前都是用vue-cli2來做，一開始還有些不熟悉。在項目快結束的時候正好需要更換瀏覽器導航的icon，發(fā)現(xiàn)并沒有那么簡單。。。

一開始就以為簡單的在public文件夾中的index.html中更換：

<link rel="icon" href="<%= BASE_URL %>favicon.ico">

目錄

結果并不起作用。。。在網(wǎng)上找了一堆答案，但是都是vue-cli2的，最后沒辦法只好回去看官方配置，發(fā)現(xiàn)原來是缺少了pwa這個配置（pwa配置在vue-cli3中是在vue.config.js文件中進行），添加以下代碼即可更換favicon。

module.exports = {
  baseUrl     : './',
  outputDir   : 'dist',
  assetsDir   : 'assets',
  devServer   : {...},
  // 以下是pwa配置
  pwa         : {
    iconPaths: {
      favicon32     : 'favicon.ico',
      favicon16     : 'favicon.ico',
      appleTouchIcon: 'favicon.ico',
      maskIcon      : 'favicon.ico',
      msTileImage   : 'favicon.ico'
    }
  }
}