时间戳

首页 > 解决方案 > 有人可以指导我如何在我的反应应用程序（firebase）中使用 imagemin-webp 吗？

minify - 有人可以指导我如何在我的反应应用程序（firebase）中使用 imagemin-webp 吗？

问题描述

我想将所有图像转换为 webp，但我不知道如何（编程菜鸟）。我构建了一个反应应用程序，我有一个 firebase.json，并且我的 package.json 中有脚本“build”：“react-app-rewired build”。

我在哪里放置代码以及如何连接它们？提前致谢。

标签： minifywebpimagemin

解决方案

如果你熟悉 nodejs，你可以使用 imagemin-webp
https://www.npmjs.com/package/imagemin-webp

npm i imagemin
npm i imagemin-webp

然后使用这个脚本：

const imagemin = require('imagemin');
const imageminWebp = require('imagemin-webp');

imagemin(['images/*.{jpg,png}'], { //input here
  destination: __dirname + '/images/converted/', //output here
  plugins: [
    imageminWebp({
      quality: 75, //quality
      resize: { //optional resizing
        width: 1000, 
        height: 0 //if one of the parameters is 0 it scales automatically 
      }
    })
  ]
}).then(() => {
  console.log('Images optimized');
});

推荐阅读