https://github.com/ulyanov-programmer/gulp-sharp-optimize-images
Compression and conversion of images for gulp using sharp.
https://github.com/ulyanov-programmer/gulp-sharp-optimize-images
avif compress convert converter gulp image images jpg png sharp webp
Last synced: 4 days ago
JSON representation
Compression and conversion of images for gulp using sharp.
- Host: GitHub
- URL: https://github.com/ulyanov-programmer/gulp-sharp-optimize-images
- Owner: Ulyanov-programmer
- Created: 2023-01-19T07:52:55.000Z (about 3 years ago)
- Default Branch: master
- Last Pushed: 2024-04-22T15:37:54.000Z (almost 2 years ago)
- Last Synced: 2025-08-19T05:23:28.772Z (7 months ago)
- Topics: avif, compress, convert, converter, gulp, image, images, jpg, png, sharp, webp
- Language: JavaScript
- Homepage:
- Size: 32.2 KB
- Stars: 13
- Watchers: 2
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# gulp-sharp-optimize-images
Tested and works with gulp `5.0.0` and `4.0.2`.
> Compression and conversion of images for gulp using [sharp](https://www.npmjs.com/package/sharp).
## What is this
### With this thing you can:
- Optimize your images.
- Convert your images to other formats (including, but not limited to `.webp` and `.avif`).
### Features
- Using the [sharp](https://www.npmjs.com/package/sharp) plugin.
- Has a minimum of dependencies.
- Supported formats: `.png .jpg/jpeg .webp .avif .tiff .heif .gif`
## Why is this
- [imagemin](https://www.npmjs.com/package/imagemin) is unmaintained, [see the issue](https://github.com/imagemin/imagemin/issues/385).
- [gulp-libsquoosh](https://www.npmjs.com/package/gulp-libsquoosh) uses the outdated library [@squoosh/lib](https://www.npmjs.com/package/@squoosh/lib), which does not have support for node > 16.0.0. In addition, the squoosh lib is no longer maintained.
- [@donmahallem/gulp-sharp](https://www.npmjs.com/package/@donmahallem/gulp-sharp) does not have normal documentation.
## How to use this
### Installation
```
npm i --D gulp-sharp-optimize-images
```
_OR_
```
yarn add gulp-sharp-optimize-images -D
```
---
### Example of usage
```js
import sharpOptimizeImages from 'gulp-sharp-optimize-images';
import gulp from 'gulp';
export function yourImages() {
return gulp
.src('yourSrcImagePath')
.pipe(
sharpOptimizeImages({
webp: {
quality: 80,
lossless: false,
alsoProcessOriginal: true,
},
avif: {
quality: 100,
lossless: true,
effort: 4,
},
jpg_to_heif: {
quality: 90,
},
png_to_avif: {},
jpg_to_jpg: {
quality: 80,
mozjpeg: true,
},
})
)
.pipe(gulp.dest('yourDistImagePath'));
}
```
## API
```js
sharpOptimizeImages({
outputImageExtname: {
param: value,
},
imageExtname_to_imageExtname: {
param: value,
},
});
```
### outputImageExtname
Type: `object`
An object that allows you to convert `all` images into images of a `specific type`.
Also optimizes and transmits the original.
```js
// example, all images will be converted to avif.
avif: {
// If true, the originals will also be optimized and transferred.
alsoProcessOriginal: false,
param: value,
},
```
#### param
Type: `any` (depends on the parameter)
Option for an output image.
To familiarize yourself with the available options, refer to the plugin documentation (for example, this section for .jpeg):
https://sharp.pixelplumbing.com/api-output#jpeg
#### alsoProcessOriginal
Type: `boolean`
Default value: `false`
It also allows you to optimize and move the original file. It only works for the type `outputImageExtname: {}` parameter.
### imageExtname_to_imageExtname
Type: `object`
An object that allows you to convert images of a `specific type` into images of a `specific type`.
Does not transmit the original.
```js
// example, all images in the format .jpg will be converted to .heif
jpg_to_heif: {
param: value,
},
// you can also optimize images without changing the extension
jpg_to_jpg: {
param: value,
},
```
### logLevel
Type: `string`
Default value: `small`
Can get the value: `small | full | ''`
Allows you to change the logging.
```js
// usage example
sharpOptimizeImages({
logLevel: 'small',
...
});
```
```bash
// Log if the value of logLevel is equal to 'small' (default value):
yourImage.jpg => webp
// Log if the value of logLevel is equal to 'full':
The file the_absolute_path_to_your/image.jpg was processed to image.webp
// Log if the value of logLevel is equal to '' (or other value):
(the log is disabled)
```
### Supported format names:
- `png`
- `jpg` | `jpeg`
- `webp`
- `avif`
- `tiff`
- `heif`
- `gif`
### If you find a bug, please create an issue [here](https://github.com/Ulyanov-programmer/gulp-sharp-optimize-images/issues).
### If this project was useful to you, you can give it a ★ in [repository](https://github.com/Ulyanov-programmer/gulp-sharp-optimize-images).