|
| 1 | +# gulp-sharp-optimize-images |
| 2 | + |
| 3 | +> Compression and conversion of images for gulp using [sharp](https://www.npmjs.com/package/sharp). |
| 4 | +
|
| 5 | +## What is this |
| 6 | +### With this thing you can: <br> |
| 7 | +- Optimize your images |
| 8 | +- Convert your images to other formats (including, but not limited to `.webp` and `.avif`). |
| 9 | +### Features |
| 10 | +- Using the [sharp](https://www.npmjs.com/package/sharp) plugin. |
| 11 | +- Has a minimum of dependencies. |
| 12 | +- Supported formats: `.gif .png .jpg/jpeg .webp .avif .tiff .heif` |
| 13 | + |
| 14 | +## Why is this |
| 15 | + |
| 16 | +- [imagemin](https://www.npmjs.com/package/imagemin) is unmaintained, [see the issue](https://github.com/imagemin/imagemin/issues/385) |
| 17 | +- [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. |
| 18 | +- [@donmahallem/gulp-sharp](https://www.npmjs.com/package/@donmahallem/gulp-sharp) does not have normal documentation. |
| 19 | +- I have not found a single plugin that would simultaneously allow you to use the [sharp library](https://www.npmjs.com/package/sharp), convert and optimize images. |
| 20 | + |
| 21 | + |
| 22 | +## How to use this |
| 23 | +### Installation |
| 24 | + |
| 25 | +```sh |
| 26 | +$ npm install --D gulp-sharp-optimize-images |
| 27 | +``` |
| 28 | + |
| 29 | +### Example |
| 30 | + |
| 31 | +```js |
| 32 | +import sharpOptimizeImages from 'gulp-sharp-optimize-images' |
| 33 | +import gulp from 'gulp' |
| 34 | + |
| 35 | +export function yourImages() { |
| 36 | + return gulp.src('yourSrcImagePath') |
| 37 | + .pipe( |
| 38 | + sharpOptimizeImages({ |
| 39 | + jpg: { |
| 40 | + quality: 100, |
| 41 | + progressive: false, |
| 42 | + mozjpeg: true, |
| 43 | + }, |
| 44 | + webp: { |
| 45 | + quality: 80, |
| 46 | + lossless: false, |
| 47 | + }, |
| 48 | + avif: { |
| 49 | + quality: 100, |
| 50 | + lossless: true, |
| 51 | + effort: 4, |
| 52 | + } |
| 53 | + }) |
| 54 | + ) |
| 55 | + |
| 56 | + .pipe(gulp.dest('yourDistImagePath')) |
| 57 | +} |
| 58 | +``` |
| 59 | + |
| 60 | +## API |
| 61 | +```js |
| 62 | +sharpOptimizeImages({ |
| 63 | + outputImageObject: { |
| 64 | + param: value, |
| 65 | + }, |
| 66 | +}) |
| 67 | +``` |
| 68 | + |
| 69 | +### outputImageObject |
| 70 | +Type: `object`<br> |
| 71 | +An object containing the name (format name) of an output image and its properties. <br> |
| 72 | +Supported format names: |
| 73 | +- `png` |
| 74 | +- `jpg` | `jpeg` |
| 75 | +- `webp` |
| 76 | +- `avif` |
| 77 | +- `tiff` |
| 78 | +- `heif` |
| 79 | +- `gif` |
| 80 | + |
| 81 | +### param |
| 82 | +Type: `any` (depends on the parameter)<br> |
| 83 | +Option for the output image. <br> |
| 84 | +To get acquainted with all the available parameters, please take a look |
| 85 | +https://sharp.pixelplumbing.com/api-output#jpeg |
0 commit comments