vue + spring boot項目的favicon解決方案

對於Spring boot通常我們會採用maven方式統一將前後臺代碼打包在一起進行部署，往往頁面的favicon是默認的綠葉圖標，下面講一下如何自定義favicon.

在Vue的項目代碼中build文件夾，修改文件webpack.prod.conf.js

new HtmlWebpackPlugin({
      filename: process.env.NODE_ENV === 'testing'
        ? 'index.html'
        : config.build.index,
      template: 'index.html',
      inject: true,
      ......

添加關於favicon打包配置，例如：

new HtmlWebpackPlugin({
      filename: process.env.NODE_ENV === 'testing'
        ? 'index.html'
        : config.build.index,
      template: 'index.html',
      inject: true,
      favicon: path.resolve('./favicon.ico'),
      ......

通常把自定義的圖標文件和index.html放在一起，這樣maven打包後的文件自動包括了favicon.ico文件。

注意，在部署以後需要清理瀏覽器緩存，這樣就可以看到自定義圖標出現了。

Good Luck.

Cheers!