images-folder-optimizer

A high performance package that uses sharp.js to recursively optimize, transform and convert images from a folder to smaller, web-friendly JPEG, PNG, WebP, GIF and AVIF images. It is also possible to add watermark to the output images controlling opacity and positioning.

!GITHUB VERSION !NPM VERSION !NPM Downloads !NPM License 

FEATURES

- PROCCESS ALL IMAGE FILES IN A FOLDER AT ONCE
- SIGNIFICANT REDUCTION IN IMAGE SIZE
- SCAN FOR IMAGE FILES RECURSIVELY ON ALL SUBFOLDERS
- CONVERSION BETWEEN IMAGE FORMATS, CHOOSING BOTH INPUT AND OUTPUT FORMATS
- IMAGE RESIZING
- IMAGE TRANSFORMATIONS (ONLY BLUR FOR NOW)
- POSSIBILITY TO OVERLAP A WATERMARK IMAGE CONTROLLING ITS OPACITY
- FULL TYPESCRIPT SUPPORT
- FULL CONTROL FOR SHARP.JS PARAMETERS

HOW TO USE IN YOUR PROJECT

- INSTALL THE PACKAGE:

``bash
npm install -D images-folder-optimizer
`

- CREATE A JAVASCRIPT (OR TYPESCRIPT) FILE, AS example.js:

`javascript
import { functionOptimizeImages } from 'images-folder-optimizer';

functionOptimizeImages({
stringOriginFolder: 'static/images/originals',
stringDestinationFolder: 'static/images/optimized',
arrayOriginFormats: ['jpg', 'png'],
arrayDestinationFormats: ['webp', 'avif'],
}).then((results) => {
console.table(results);
});
`

- RUN THE FILE:

`bash
node example.js
`

- CHECK THE NEW IMAGES IN static/images/optimized.

BUILT-IN EXAMPLES

YOU CAN FIND BUILT-IN EXAMPLES IN src/examples/ [LINK]. LET'S TRY ONE OF THEM:

`bash
npx tsc
node dist/examples/exampleFormatConversion.js
`

PARAMETERS AND TYPING

- PARAMETERS FOR functionOptimizeImages:

| PARAMETER | DESCRIPTION | TYPE | REQUIRED | DEFAULT |
| - | - | - | - | - |
| stringOriginFolder | THE FOLDER WITH THE ORIGINAL IMAGES | string | YES | - |
| stringDestinationFolder | THE FOLDER WHERE THE OPTIMIZED IMAGES ARE GOING TO BE SAVED | string | YES | - |
| arrayOriginFormats | FORMATS OF THE ORIGINAL IMAGES | ARRAY WITH ELEMENTS BEEING 'webp' OR 'avif' OR 'png' OR 'jpg' OR 'tiff' OR 'gif' | YES | - |
| arrayDestinationFormats | FORMATS FOR THE NEW IMAGES | ARRAY WITH ELEMENTS BEEING 'webp' OR 'avif' OR 'png' OR 'jpg' OR 'tiff' OR 'gif' OR 'svg' | YES | - |
| stringFileNameSuffix | SUFIX FOR THE NEW FILE NAMES. EVERY ORIGINAL FILE NAME WITH THIS SUFIX IS GOING TO BE IGNORED | NO | - |
| objectResizeOptions | SHARP.JS OPTIONS FOR IMAGE RESIZING | CHECK IT HERE | NO | - |
| objectPngOptions | SHARP.JS OPTIONS FOR PNG TRANSFORMATIONS | CHECK IT HERE | NO | - |
| objectJpegOptions | SHARP.JS OPTIONS FOR JPG TRANSFORMATIONS | CHECK IT HERE | NO | - |
| objectWebpOptions | SHARP.JS OPTIONS FOR WEBP TRANSFORMATIONS | CHECK IT HERE | NO | - |
| objectAvifOptions | SHARP.JS OPTIONS FOR AVIF TRANSFORMATIONS | CHECK IT HERE | NO | - |
| objectAvifOptions | SHARP.JS OPTIONS FOR AVIF TRANSFORMATIONS | CHECK IT HERE | NO | - |
| objectTiffOptions | SHARP.JS OPTIONS FOR TIFF TRANSFORMATIONS | CHECK IT HERE | NO | - |
| objectGifOptions | SHARP.JS OPTIONS FOR GIF TRANSFORMATIONS | CHECK IT HERE | NO | - |
| objectBlurOptions | SHARP.JS OPTIONS FOR BLUR TRANSFORMATIONS | CHECK IT HERE | NO | - |
| objectWatermarkOptions | OBJECT WITH OPTIONS FOR WATERMARK INSERTION | typeWatermarkOptions DESCRIBED BELLOW | NO | - |

- typeWatermarkOptions TYPE:

| KEY | DESCRIPTION | TYPE | REQUIRED | DEFAULT |
| - | - | - | - | - |
| stringWatermarkFile | PATH OF THE IMAGE TO USE AS WATERMARK | string | YES | - |
| numberOpacity | WATERMARK OPACITY | number BETWEEN 0 AND 1 | YES | - |
| objectResizeOptions | SHARP.JS OPTIONS FOR RESIZING THE WATERMARK IMAGE | CHECK IT HERE | NO | - |
| stringGravity | WATERMARK POSITION | 'centre' OR 'northwest' OR 'northeast' OR 'southeast' OR 'southwest' | NO | centre` |