Skip to content

Ejemplos Básicos

Aquí se proporcionan algunos ejemplos básicos de uso de Sharp para ayudarte a comenzar rápidamente.

Redimensionamiento de Imágenes

Redimensionamiento Simple

javascript
import sharp from 'sharp';

// Redimensionar a tamaño especificado
await sharp('input.jpg')
  .resize(300, 200)
  .toFile('output.jpg');

Mantener Relación de Aspecto

javascript
// Solo especificar ancho, alto se calcula automáticamente
await sharp('input.jpg')
  .resize(300)
  .toFile('output.jpg');

// Solo especificar alto, ancho se calcula automáticamente
await sharp('input.jpg')
  .resize(null, 200)
  .toFile('output.jpg');

Modos de Ajuste

javascript
// cover: Mantener relación de aspecto, recortar partes excedentes
await sharp('input.jpg')
  .resize(300, 200, { fit: 'cover' })
  .toFile('output.jpg');

// contain: Mantener relación de aspecto, agregar fondo
await sharp('input.jpg')
  .resize(300, 200, { fit: 'contain', background: { r: 255, g: 255, b: 255 } })
  .toFile('output.jpg');

Conversión de Formatos

JPEG a PNG

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

PNG a JPEG

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

Convertir a WebP

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

Convertir a AVIF

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

Rotación de Imágenes

Rotar 90 Grados

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

Rotación Automática (Según EXIF)

javascript
await sharp('input.jpg')
  .rotate()  // Rotación automática
  .toFile('output.jpg');

Volteo de Imágenes

Volteo Vertical

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

Volteo Horizontal

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

Recorte de Imágenes

Recortar Región Especificada

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

Recortar y Redimensionar

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

Efectos de Filtro

Conversión a Escala de Grises

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

Efecto de Desenfoque

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

Efecto de Nitidez

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

Inversión de Color

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

Ajuste de Color

Ajuste de Brillo

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

Ajuste de Saturación

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

Ajuste de Tono

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

Manejo de Transparencia

Agregar Transparencia

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

Eliminar Transparencia

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

Configuración de Calidad

Calidad JPEG

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

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

// Baja calidad (archivo pequeño)
await sharp('input.png')
  .jpeg({ quality: 50 })
  .toFile('output.jpg');

Calidad WebP

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

Operaciones Encadenadas

Combinación de Múltiples Operaciones

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

Procesamiento Condicional

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');

Manejo de Errores

Manejo Básico de Errores

javascript
try {
  await sharp('input.jpg')
    .resize(300, 200)
    .toFile('output.jpg');
} catch (error) {
  console.error('Procesamiento de imagen fallido:', error.message);
}

Verificar Existencia de Archivo

javascript
const fs = require('fs');

if (fs.existsSync('input.jpg')) {
  await sharp('input.jpg')
    .resize(300, 200)
    .toFile('output.jpg');
} else {
  console.error('El archivo de entrada no existe');
}

Procesamiento por Streams

Leer desde Stream

javascript
const fs = require('fs');

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

Salida a Stream

javascript
const fs = require('fs');

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

Procesamiento de Buffer

Crear desde 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);

Salida a Buffer

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

// Puedes usar el buffer directamente
console.log('Tamaño de imagen:', buffer.length);

Procesamiento por Lotes

Procesar Todas las Imágenes en un Directorio

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(`Procesamiento completado: ${file}`);
      } catch (error) {
        console.error(`Error al procesar ${file}:`, error.message);
      }
    }
  }
}

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

Enlaces Relacionados

Liberado bajo la Licencia Apache 2.0.