{"_id":"@254guru/webp-convert","name":"@254guru/webp-convert","dist-tags":{"latest":"2.4.0"},"versions":{"2.4.0":{"name":"@254guru/webp-convert","version":"2.4.0","description":"Automatically convert PNG/JPG images to WebP with responsive size variants. CLI, file watcher, build plugin, and programmatic API.","main":"src/index.js","bin":{"webp-convert":"bin/cli.js"},"scripts":{"test":"node test/index.test.js"},"keywords":["webp","image","convert","responsive","cli","vite","webpack","rollup","watch"],"author":"","license":"MIT","dependencies":{"chokidar":"^3.6.0","sharp":"^0.33.4","picocolors":"^1.0.1"},"devDependencies":{"vite":"^5.0.0"},"engines":{"node":">=16.0.0"},"gitHead":"4c085b9b33cb6a87b60492e03f129c45b5ac471b","_id":"@254guru/webp-convert@2.4.0","_nodeVersion":"22.20.0","_npmVersion":"11.7.0","dist":{"integrity":"sha512-9I5mc5VzAECJMJkRTYU7uaQufbeBEADvYqMqfjFNBbS5WHdiRpe0d1S5G91Q1qtIyvvii5xyVyfKOgZ+lI9qqQ==","shasum":"cc0e1893c9bbb7bf755f15bf01cbe0510d84779f","tarball":"https://registry.npmjs.org/@254guru/webp-convert/-/webp-convert-2.4.0.tgz","fileCount":4,"unpackedSize":19892,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEYCIQD0F5NuGF/DngXLmP1W1uF5lhNtDThjFMhAxWAzLDSMIwIhAN5B3N1AnM/aaxohZdyLvLi9Cjj9+aVzww9htKX0hBds"}]},"_npmUser":{"name":"254guru","email":"otienooluda@gmail.com"},"directories":{},"maintainers":[{"name":"254guru","email":"otienooluda@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/webp-convert_2.4.0_1772889038463_0.2746641188290646"},"_hasShrinkwrap":false}},"time":{"created":"2026-03-07T13:10:38.375Z","2.4.0":"2026-03-07T13:10:38.627Z","modified":"2026-03-07T13:10:38.855Z"},"maintainers":[{"name":"254guru","email":"otienooluda@gmail.com"}],"description":"Automatically convert PNG/JPG images to WebP with responsive size variants. CLI, file watcher, build plugin, and programmatic API.","keywords":["webp","image","convert","responsive","cli","vite","webpack","rollup","watch"],"license":"MIT","readme":"# webp-convert\n\n> Automatically convert PNG/JPG/GIF/TIFF images to WebP with responsive size variants.\n> Zero-config CLI, file watcher, build plugins (Vite / Rollup / Webpack), and programmatic API.\n\n---\n\n## Install\n\n```bash\n# npm\nnpm install webp-convert\n\n# yarn\nyarn add webp-convert\n\n# pnpm\npnpm add webp-convert\n\n# global CLI\nnpm install -g webp-convert\n```\n\n> Uses [`sharp`](https://sharp.pixelplumbing.com/) — no external binaries required (cwebp, ImageMagick, etc.).\n\n---\n\n## Quick start\n\n```bash\n# Convert everything in assets/images (default)\nwebp-convert\n\n# Custom dir + quality\nwebp-convert src/img -q 90\n\n# Watch mode — auto-converts on file change\nwebp-convert src/img --watch\n\n# Custom responsive sizes\nwebp-convert src/img --sizes 1200,800,400\n\n# Write outputs to a separate directory\nwebp-convert src/img -o dist/img\n```\n\n---\n\n## CLI reference\n\n```\nUsage: webp-convert [input-dir] [options]\n\nOptions:\n -o, --output Output directory (default: same as source)\n -q, --quality <0-100> WebP quality (default: 80)\n --lossless Lossless encoding\n --sizes Responsive widths, e.g. 1200,800,400 (0 = full-size)\n --no-full Skip full-size output (only responsive sizes)\n --recursive, -r Recurse into subdirectories\n --no-overwrite Skip files that already have a .webp counterpart\n --watch, -w Watch mode\n --config Load config from a JS/JSON file\n --silent Suppress all output\n -h, --help Show help\n```\n\n---\n\n## Config file\n\nCreate `webp.config.js` in your project root:\n\n```js\n// webp.config.js\nmodule.exports = {\n input: 'src/images',\n output: 'public/images', // omit to write next to originals\n quality: 85,\n lossless: false,\n recursive: true,\n overwrite: true,\n sizes: [\n { width: 0, suffix: '' }, // full size\n { width: 1200, suffix: '-1200' },\n { width: 800, suffix: '-800' },\n { width: 400, suffix: '-400' },\n ],\n extensions: ['.png', '.jpg', '.jpeg', '.gif', '.tiff'],\n};\n```\n\nThen run:\n\n```bash\nwebp-convert --config webp.config.js\n```\n\n---\n\n## Programmatic API\n\n```js\nconst { convert, watch, convertFile } = require('webp-convert');\n\n// Convert a whole directory\nawait convert({\n input: 'src/images',\n quality: 85,\n sizes: [\n { width: 0, suffix: '' },\n { width: 800, suffix: '-800' },\n ],\n onFile: ({ src, dest, size }) => {\n console.log(`${src} → ${dest} (${size} bytes)`);\n },\n});\n\n// Convert a single file\nawait convertFile('src/hero.png', { quality: 90 });\n\n// Watch a directory\nconst watcher = watch({ input: 'src/images', recursive: true });\n// stop later:\nwatcher.close();\n```\n\n---\n\n## Vite plugin\n\n```js\n// vite.config.js\nimport { defineConfig } from 'vite';\nimport { vitePlugin } from 'webp-convert';\n\nexport default defineConfig({\n plugins: [\n vitePlugin({\n input: 'public/images',\n quality: 85,\n sizes: [\n { width: 0, suffix: '' },\n { width: 800, suffix: '-800' },\n { width: 400, suffix: '-400' },\n ],\n }),\n ],\n});\n```\n\nRuns on `vite build` and watches during `vite dev`.\n\n---\n\n## Rollup plugin\n\n```js\n// rollup.config.js\nimport { rollupPlugin } from 'webp-convert';\n\nexport default {\n plugins: [\n rollupPlugin({ input: 'src/images' }),\n ],\n};\n```\n\n---\n\n## Webpack plugin\n\n```js\n// webpack.config.js\nconst { WebpackWebpPlugin } = require('webp-convert');\n\nmodule.exports = {\n plugins: [\n new WebpackWebpPlugin({ input: 'src/images', quality: 80 }),\n ],\n};\n```\n\n---\n\n## Output structure\n\nGiven `hero.jpg` in `src/images/`:\n\n```\nsrc/images/\n├── hero.jpg (original, kept by default)\n├── hero.webp (full size)\n├── hero-800.webp (800px wide, aspect-ratio preserved)\n└── hero-400.webp (400px wide)\n```\n\n---\n\n## HTML usage\n\n```html\n\n \n \"Hero\n\n```\n\n---\n\n## License\n\nMIT\n","readmeFilename":"README.md","_rev":"1-eeeeb91417df17f9c3f88c71feecda5a"}