处理图片资源
处理图片不需要下载loader,本身webpack可以处理。
![在这里插入图片描述](https://img-blog.csdnimg.cn/d481fffa394c4ec2909897d6d6084b87.png)
导入图片并引用,打包,会在dist下生成图片
![在这里插入图片描述](https://img-blog.csdnimg.cn/f3c6bb28aa17447ab552447b8e446bce.png)
{
test: /\.(png|jpe?g|gif|webp|svg)/,
type: 'asset',
parser: {
dataUrlCondition: {
//小于10kb的图片转base64
// 优点:缺少请求数量;缺点:体积会变大
maxSize: 10 * 1024 // 10kb
}
}
}
优化:为了减少请求数量,对小于10kb的图片进行处理,转为base64,再进行打包。