标签 webpack 下的文章

最近在给组件底层脚手架升级，同时也把webpack4升级到了webpack5，但是发现升级后打包会生成LICENSE文件：

2024-07-30T05:17:42.png

查阅官网资料，找到了解决办法：

https://webpack.docschina.org/plugins/terser-webpack-plugin/#extractcomments

在webpack.config.js中修改配置：

const TerserPlugin = require("terser-webpack-plugin")
module.exports = {
    optimization: {
        minimize: true,
        minimizer: [new TerserPlugin({
           extractComments: false, //不将注释提取到单独的文件中
        })],
    },
}

修改之前，再次打包即可。

问题：

在页面源文件index.html的标签之间插入

<link rel="shortcut icon" href=" /favicon.ico" />

仍旧无法加载图标

解决方法：

HtmlWebpackPlugin插件中加入小图标，Vue脚手架时修改webpack.dev.conf.js配置文件：

new HtmlWebpackPlugin({
  filename: 'index.html',
  template: 'index.html',
  favicon: './favicon.ico', // 添加小图标
  inject: true
}),

不要忘记webpack.prod.conf.js中也需要添加

注：( favicon.ico放入根目录。)