vue + spring boot项目的favicon解决方案

最新推荐文章于 2024-03-01 16:52:05 发布

java_augur

最新推荐文章于 2024-03-01 16:52:05 发布

阅读量387

点赞数

分类专栏： Eclipse Javascript Vue

本文链接：https://blog.csdn.net/java_augur/article/details/105290127

版权

Vue 同时被 3 个专栏收录

17 篇文章 0 订阅

订阅专栏

Eclipse

13 篇文章 0 订阅

订阅专栏

Javascript

11 篇文章 0 订阅

订阅专栏

对于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!