You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何通过npm run脚本运行imagemin插件?下载后能否用其运行?

How to Run imagemin via npm run Scripts & Use the Plugin

Hey there! Let's break this down step by step since imagemin works a bit differently depending on whether you're using the CLI tool or the core Node.js library. The short answer is yes, you absolutely can run imagemin via npm run—here's how to set it up for both scenarios:

Option 1: Use imagemin-cli (Quick Command-Line Approach)

The easiest way to run imagemin via npm scripts is to use the official CLI wrapper, imagemin-cli. If you haven't installed it yet, do this first:

npm install imagemin-cli --save-dev

Next, open your package.json and add a new script under the scripts section. For example, if your source images are in src/images/ and you want to output compressed images to dist/images/, your script would look like this:

{
  "scripts": {
    "imagemin": "imagemin src/images/* --out-dir=dist/images"
  }
}

To run it:

Just execute this command in your terminal:

npm run imagemin

You can tweak the parameters to match your project:

  • Replace src/images/* with your actual source image path (use *.{jpg,png,gif} to target specific file types)
  • Adjust --out-dir=dist/images to your preferred output directory
  • Add flags like --quality=80 to set a global compression quality (check imagemin-cli --help for more options)

Option 2: Use the Core imagemin Library (Custom Script)

If you installed the core imagemin package (not the CLI), you'll need to write a small Node.js script to use it, then hook that script into npm run.

Step 1: Install required plugins

The core imagemin package doesn't include compression codecs—you need to install specific plugins for each image type (e.g., JPEG, PNG). For example:

npm install imagemin imagemin-mozjpeg imagemin-pngquant --save-dev

Step 2: Create a custom script file

Make a new file (e.g., imagemin-script.js) in your project root with this code:

const imagemin = require('imagemin');
const imageminMozjpeg = require('imagemin-mozjpeg');
const imageminPngquant = require('imagemin-pngquant');

// Async function to handle image compression
(async () => {
  try {
    const compressedFiles = await imagemin(
      // Target files: adjust the path and extensions to match your project
      ['src/images/*.{jpg,png}'],
      {
        destination: 'dist/images', // Output directory
        plugins: [
          // Configure JPEG compression (quality 80 is a good balance)
          imageminMozjpeg({ quality: 80 }),
          // Configure PNG compression (quality range 0.6–0.8)
          imageminPngquant({ quality: [0.6, 0.8] })
        ]
      }
    );

    console.log('✅ Images compressed successfully!');
    console.log('Compressed files:', compressedFiles.map(file => file.sourcePath));
  } catch (error) {
    console.error('❌ Error compressing images:', error);
  }
})();

Step 3: Add the script to package.json

Update your package.json to include a script that runs this Node.js file:

{
  "scripts": {
    "imagemin": "node imagemin-script.js"
  }
}

To run it:

Same as before—just run:

npm run imagemin

Key Notes

  • Path adjustments: Always double-check your source and output paths to match your project's structure
  • Plugin choices: There are tons of imagemin plugins (for WebP, SVG, GIF, etc.)—install the ones you need and add them to the plugins array in your script
  • Customization: Both the CLI and script approaches let you tweak compression settings to balance file size and image quality

内容的提问来源于stack exchange,提问作者Dimitris Leon

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.19 08:21:49