什么是 imagemin-brunch？
imagemin-brunch 是一个用于优化和缩小图像大小的 npm 包。它可以自动地缩小 png、jpg、jpeg、gif、svg 等图片，并压缩图片质量从而减小图片的大小。这将使得网页的加载速度更快，提高用户体验。
imagemin-brunch 使用方法
安装 imagemin-brunch 老版本的命令如下：
npm install imagemin-brunch@5.0.0 --save-dev
如果你使用最新版的 imagemin-brunch，可以运行以下命令来安装：
npm install imagemin-brunch --save-dev
在你的 brunch-config.js 中导入 imagemin-brunch 插件：
plugins: {
imagemin: {
plugins: ['imagemin-pngquant'],
pattern: /\.(png|jpg|jpeg|gif|svg)$/i
}
}imagemin-brunch 使用示例
下面我们通过一个样例来演示使用 imagemin-brunch 进行图片优化和大小缩小。
我们首先准备了一张 500KB 的图片文件。在 brunch-config.js 文件中，我们启用了 imagemin-brunch 插件，代码如下所示：
plugins: {
imagemin: {
plugins: ['imagemin-pngquant'],
pattern: /\.(png|jpg|jpeg|gif|svg)$/i
}
}plugins参数是指的用于imagemin-brunch优化图片的插件列表，imagemin-pngquant 是其中一个插件。pattern参数是指哪些类型的图片需要优化和压缩大小。
接下来，我们在 Console 中运行需要优化的任务：
brunch build -P
运行后，我们会看到,优化压缩后的图片，大小就减小到了 300KB。此时，将原始图片和优化后的图片进行一下对比，可以看到图像质量并没有明显变化，但是大小减小了很多。
使用 imagemin-brunch，我们可以轻松地优化和缩小图片大小，从而提高网页的加载速度。相信这篇教程能够帮助你更好地使用该 npm 包。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005600f81e8991b448dded0