Resize and optimize images with NodeJS
There are many packages and tools which do that.
Most of them are doing a lot of other things.
This package is focused on two tasks and does them pretty well:
- Resizes your images and
- Optimizes their size
npm i @three11/optisize
or
yarn add @three11/optisize
This tool accepts the following arguments:
src
: String - Source folder or file (Required)width
: Number - Target width (Optional)height
: Number - Target height (Optional)
- The
src
argument should represent a relative path to your images folder or to your single image. The path is relative to your project's root folder. If thesrc
is a folder, all images located inside other folders in that folder will be recursively optisized as well.
import optisize from '@three11/optisize';
const optisizeSettings = {
src: 'path/to/images',
width: 640,
height: 360
};
optisize(optisizeSettings);
Add the following in the scripts
section of your package.json
file:
{
"optisize": "optisize"
}
Then invoke the script and supply the required arguments:
yarn optisize --src="path/to/images" --width=640 --height=360
or
npm run optisize --src="path/to/images" --width=640 --height=360
width
and height
settings are not required and can be supplied together, alone and also can be missing.
If they are missing, the images will only be optimized.
Optisize supports smart configuration settings via Cosmiconfig:
- a
package.json
"optisize" property - a JSON or YAML, extensionless "rc file" -
.optisizerc
- an "rc file" with the extensions
.json
,.yaml
,.yml
,.js
, or.cjs
-.optisize.json
,.optisize.yaml
,.optisize.yml
,.optisize.js
, or.optisize.cjs
- a
.config.js
or.config.cjs
CommonJS module -optisize.config.js
oroptisize.config.cjs
{
// See https://github.com/imagemin/imagemin-gifsicle for more info
"gif": {
"interlaced": true
},
// See https://github.com/imagemin/imagemin-mozjpeg for more info
"jpeg": {
"quality": 70
},
// See https://github.com/imagemin/imagemin-pngquant for more info
"png": {
"quality": [0.5, 0.7]
},
// See https://github.com/imagemin/imagemin-svgo for more info
"svg": {},
// See https://github.com/imagemin/imagemin-webp for more info
"webp": {
"quality": 50
}
}
MIT