Sharp 中文网

Appearance

基本示例 ​

这里提供了一些 Sharp 的基本使用示例，帮助你快速上手。

调整图像大小 ​

简单调整大小 ​

javascript
import sharp from 'sharp';

// 调整到指定尺寸
await sharp('input.jpg')
  .resize(300, 200)
  .toFile('output.jpg');

保持宽高比 ​

javascript
// 只指定宽度，高度自动计算
await sharp('input.jpg')
  .resize(300)
  .toFile('output.jpg');

// 只指定高度，宽度自动计算
await sharp('input.jpg')
  .resize(null, 200)
  .toFile('output.jpg');

适应模式 ​

javascript
// cover: 保持宽高比，裁剪超出部分
await sharp('input.jpg')
  .resize(300, 200, { fit: 'cover' })
  .toFile('output.jpg');

// contain: 保持宽高比，添加背景
await sharp('input.jpg')
  .resize(300, 200, { fit: 'contain', background: { r: 255, g: 255, b: 255 } })
  .toFile('output.jpg');

格式转换 ​

JPEG 转 PNG ​

javascript
await sharp('input.jpg')
  .png()
  .toFile('output.png');

PNG 转 JPEG ​

javascript
await sharp('input.png')
  .jpeg({ quality: 80 })
  .toFile('output.jpg');

转换为 WebP ​

javascript
await sharp('input.jpg')
  .webp({ quality: 80 })
  .toFile('output.webp');

转换为 AVIF ​

javascript
await sharp('input.jpg')
  .avif({ quality: 80 })
  .toFile('output.avif');

图像旋转 ​

旋转 90 度 ​

javascript
await sharp('input.jpg')
  .rotate(90)
  .toFile('output.jpg');

自动旋转（根据 EXIF） ​

javascript
await sharp('input.jpg')
  .rotate()  // 自动旋转
  .toFile('output.jpg');

图像翻转 ​

垂直翻转 ​

javascript
await sharp('input.jpg')
  .flip()
  .toFile('output.jpg');

水平翻转 ​

javascript
await sharp('input.jpg')
  .flop()
  .toFile('output.jpg');

图像裁剪 ​

裁剪指定区域 ​

javascript
await sharp('input.jpg')
  .extract({ left: 100, top: 100, width: 300, height: 200 })
  .toFile('output.jpg');

裁剪并调整大小 ​

javascript
await sharp('input.jpg')
  .extract({ left: 100, top: 100, width: 300, height: 200 })
  .resize(150, 100)
  .toFile('output.jpg');

滤镜效果 ​

灰度转换 ​

javascript
await sharp('input.jpg')
  .grayscale()
  .toFile('output.jpg');

模糊效果 ​

javascript
await sharp('input.jpg')
  .blur(5)
  .toFile('output.jpg');

锐化效果 ​

javascript
await sharp('input.jpg')
  .sharpen()
  .toFile('output.jpg');

反转颜色 ​

javascript
await sharp('input.jpg')
  .negate()
  .toFile('output.jpg');

颜色调整 ​

亮度调整 ​

javascript
await sharp('input.jpg')
  .modulate({ brightness: 1.2 })
  .toFile('output.jpg');

饱和度调整 ​

javascript
await sharp('input.jpg')
  .modulate({ saturation: 0.8 })
  .toFile('output.jpg');

色相调整 ​

javascript
await sharp('input.jpg')
  .modulate({ hue: 180 })
  .toFile('output.jpg');

透明度处理 ​

添加透明度 ​

javascript
await sharp('input.jpg')
  .ensureAlpha()
  .png()
  .toFile('output.png');

移除透明度 ​

javascript
await sharp('input.png')
  .flatten({ background: { r: 255, g: 255, b: 255 } })
  .jpeg()
  .toFile('output.jpg');

质量设置 ​

JPEG 质量 ​

javascript
// 高质量
await sharp('input.png')
  .jpeg({ quality: 95 })
  .toFile('output.jpg');

// 中等质量
await sharp('input.png')
  .jpeg({ quality: 80 })
  .toFile('output.jpg');

// 低质量（小文件）
await sharp('input.png')
  .jpeg({ quality: 50 })
  .toFile('output.jpg');

WebP 质量 ​

javascript
await sharp('input.jpg')
  .webp({ quality: 80, lossless: false })
  .toFile('output.webp');

链式操作 ​

多个操作组合 ​

javascript
await sharp('input.jpg')
  .resize(800, 600)
  .rotate(90)
  .blur(2)
  .sharpen()
  .jpeg({ quality: 80 })
  .toFile('output.jpg');

条件处理 ​

javascript
const image = sharp('input.jpg').resize(300, 200);

if (needsBlur) {
  image.blur(3);
}

if (needsSharpen) {
  image.sharpen();
}

await image.jpeg({ quality: 80 }).toFile('output.jpg');

错误处理 ​

基本错误处理 ​

javascript
try {
  await sharp('input.jpg')
    .resize(300, 200)
    .toFile('output.jpg');
} catch (error) {
  console.error('图像处理失败:', error.message);
}

检查文件存在 ​

javascript
const fs = require('fs');

if (fs.existsSync('input.jpg')) {
  await sharp('input.jpg')
    .resize(300, 200)
    .toFile('output.jpg');
} else {
  console.error('输入文件不存在');
}

流式处理 ​

从流读取 ​

javascript
const fs = require('fs');

fs.createReadStream('input.jpg')
  .pipe(sharp().resize(300, 200))
  .pipe(fs.createWriteStream('output.jpg'));

输出到流 ​

javascript
const fs = require('fs');

sharp('input.jpg')
  .resize(300, 200)
  .jpeg({ quality: 80 })
  .pipe(fs.createWriteStream('output.jpg'));

Buffer 处理 ​

从 Buffer 创建 ​

javascript
const fs = require('fs');

const inputBuffer = fs.readFileSync('input.jpg');
const outputBuffer = await sharp(inputBuffer)
  .resize(300, 200)
  .jpeg({ quality: 80 })
  .toBuffer();

fs.writeFileSync('output.jpg', outputBuffer);

输出到 Buffer ​

javascript
const buffer = await sharp('input.jpg')
  .resize(300, 200)
  .jpeg({ quality: 80 })
  .toBuffer();

// 可以直接使用 buffer
console.log('图像大小:', buffer.length);

批量处理 ​

处理目录中的所有图像 ​

javascript
const fs = require('fs').promises;
const path = require('path');

async function processImages(inputDir, outputDir) {
  const files = await fs.readdir(inputDir);
  
  for (const file of files) {
    if (file.match(/\.(jpg|jpeg|png|webp)$/i)) {
      try {
        await sharp(path.join(inputDir, file))
          .resize(300, 200)
          .jpeg({ quality: 80 })
          .toFile(path.join(outputDir, file));
        
        console.log(`处理完成: ${file}`);
      } catch (error) {
        console.error(`处理失败 ${file}:`, error.message);
      }
    }
  }
}

processImages('./input', './output');

相关链接 ​

Released under the Apache 2.0 License.

Copyright © 2013-present Lovell Fuller and contributors