webpack打包会根据webp-loader生成webp格式图片

本文介绍如何通过webpack配置webp-loader,将项目中的图片资源转换为webp格式,以实现更高效的网页加载和资源优化。
摘要由CSDN通过智能技术生成
/***
 * create by porter
 * 这个loader已经包含了url-loader file-loader
 * webp的
 * 参数:options{
 *   name:[name].[hash].[ext] 不传则默认使用hash 这个是url|file|webp
 *   preset 文件类型 default,photo,picture,drawing,icon和text。
 *   quality 质量
 *   alphaQuality 在0和之间设置透明压缩质量100。
 *   method 在0(最快)和6(最慢)之间指定要使用的压缩方法。此参数控制编码速度与压缩文件大小和质量之间的权衡。
 *   sns 在0和之间设置空间噪声整形的幅度100
 *   autoFilter 将解块滤波器强度设置在0(off)和之间100
 *   sharpness 在0(最锐利)和7(最不锐利)之间设置滤镜锐度
 *   lossless 无损编码图像。
 *
 * }
 */
var imagemin = require('imagemin');
var imageminWebp = require('imagemin-webp');
var loaderUtils = require('loader-utils');
var mime = require("mime");

module.exports = function(content) {
  this.cacheable && this.cacheable();
  if (!this.emitFile) throw new Error("emitFile is required from module system");
  //异步调用
  var callback = th
  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值