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