首页
前端开发
Webpack
imagemin-webpack-plugin Webpack图像WebP转换插件

imagemin-webpack-plugin Webpack图像WebP转换插件

0 次浏览 0 条评论
zip
zip

图像的 WebP 格式转换利器，imagemin-webpack-plugin，用过觉得还挺顺手的。能在构建时把你的 PNG、JPEG 啥的转成 WebP，而且保留原图，兼容性问题不用太担心。

Webpack 的插件系统本来就挺好用，加上它更省事。你只要装好插件，在webpack.config.js里加一段配置就行，响应也快，配置也简单。

它是为 Webpack 4 准备的，不过我用在旧版本上也没啥问题。背后其实就是调了imagemin和imagemin-webp两个库，压图效果挺，WebP 一般能比原图小 25%左右。

场景也比较多：比如做移动端站点、H5 活动页，图多又想快点加载，这时候用它再合适不过了。反正现在主流浏览器都基本支持 WebP 了，还不试试？

安装方式常规：

npm install imagemin-webpack-plugin --save-dev

配置方法也简单：

const ImageminWebpackPlugin = require("imagemin-webpack-plugin");


module.exports = {
  plugins: [
    new ImageminWebpackPlugin({
      // 配置项自己看着来，比如：
      plugins: [require("imagemin-webp")({ quality: 75 })]
    })
  ]
};

如果你在意首屏加载速度，又不想动原图，可以直接上这个插件。想和其他压缩工具一起用？像 基于 TinyPNG 的插件 也可以配合着来。

zip 文件大小：342.85KB