Converts images to WebP format and replaces non-WebP image references in HTML and CSS files.
Webpify is a command-line tool that allows you to convert images to the WebP format. It provides two main functionalities:
- Image Conversion: Converts images (JPEG, PNG, and GIF) to WebP format, reducing file size while maintaining image quality.
- Image Reference Replacement: Replaces non-WebP image references in HTML and CSS files with their WebP equivalents, ensuring optimal performance on the web.
- Converts images (JPEG, PNG, and GIF) to WebP format.
- Replaces non-WebP image references in HTML and CSS files with WebP equivalents.
- Provides command-line interface for easy execution and integration into build processes.
- Preserves image quality while significantly reducing file size.
- Supports bulk image conversion and reference replacement.
- Works with both local and remote file paths.
To use Webpify, you need to have Node.js installed on your machine. Once Node.js is installed, you can install the package globally using npm:
npm install -g webpify
The package provides a command-line interface (CLI) to perform image conversion and reference replacement.
To convert images to WebP format, use the following command:
webpify --src <source_directory> --dest <destination_directory> [-q <quality>]
-
<source_directory>
: The directory containing the images to be converted. -
<destination_directory>
: The directory where the converted WebP images will be saved. -
<-q <quality>
: (optional): The quality of the converted images. The default quality is 85. Specify a value between 1 and 100.
This command converts all images (JPEG, PNG, and GIF) in the source directory to WebP format and saves them in the destination directory with the specified quality.
To replace non-WebP image references in HTML and CSS files with their WebP equivalents, use the following command:
webpify --src <source_directory> --dest <destination_directory> --replace
-
<source_directory>
: The directory containing the HTML and CSS files with image references. -
<destination_directory>
: The directory where the converted WebP images are stored. -
--replace
: Optional flag to indicate that image references should be replaced.
This command scans all HTML and CSS files in the source directory, finds non-WebP image references, and replaces them with their WebP equivalents. The modified files are saved in the same location.
Note: The --replace
flag is optional. If not provided, the image references will not be replaced.
Convert all images in the images
directory to WebP format and save them in the converted
directory:
webpify --src images --dest converted
Convert images in the images
directory to WebP format and replace image references in HTML and CSS files in the src
directory:
webpify --src src --dest images --replace
Webpify relies on the following dependencies:
- glob: ^8.1.0
- webp-converter: ^2.3.0
- yargs: ^17.0.1
These dependencies will be automatically installed when you install the package.
Contributions are welcome! If you find any issues or have suggestions for improvement, please open an issue or submit a pull request on GitHub.
Webpify was created by Angelos Barmpoutis.