webp-converter

A small node.js library for converting any image to webp file format or converting webp image to any image file format.

webp-converter v2.2.3

A small node.jslibrary for converting any image to webp file format or converting webp image to any image file format.

This library uses precompiled executables of WebP for more info visit WebP

For converting other image formats to webp, please read this documentation cwebp Encoder

For converting webp image to other image format, please read this documentation dwebp Encoder

For converting gif image to webp, please read this documentation gif2webp Converter

For creating animated webp image using webp images, please read this documentation webpmux Muxer

What's New

  • Precompiled executables of WebP(v1.0.3) added
How to use cwebp

Convert other image format to webp

var webp=require('webp-converter');

//pass input image(.jpeg,.pnp .....) path ,output image(give path where to save and image file name with .webp extension)
//pass option(read  documentation for options)

//cwebp(input,output,option,result_callback)

webp.cwebp("input.jpg","output.webp","-q 80",function(status,error)
  {
       //if conversion successful status will be '100'
      //if conversion fails status will be '101'
      console.log(status,error);    
  });

dwebp

Convert webp image to other image format

var webp=require('webp-converter');

//pass input image(.webp image) path ,output image(.jpeg,.pnp .....)

//dwebp(input,output,option,result_callback)

webp.dwebp("input.webp","output.jpg","-o",function(status,error)
  {
       //if conversion successful status will be '100'
      //if conversion fails status will be '101'
      console.log(status,error);    
  });
gif2webp

Convert gif image to webp

var webp=require('webp-converter');

//pass input image(.gif) path ,output image(give path where to save and image file name with .webp extension)
//pass option(read  documentation for options)

//gwebp(input,output,option,result_callback)

webp.gwebp("input.gif","output.webp","-q 80",function(status,error)
  {
       //if conversion successful status will be '100'
      //if conversion fails status will be '101'
      console.log(status,error);    
  });

webpmux

Add ICC profile,XMP metadata and EXIF metadata

var webp=require('webp-converter');

//pass input image(.webp image) path ,output image,option profile,set options(icc image profile,XMP metadata or EXIF metadata) and file.
//for options use keywords as below
//for ICC: icc
//for XMP metadata: xmp
//for EXIF metadata: exif

//webpmux_add(input,output,option_profile,set_option,result_callback)

webp.webpmux_add("input.webp","output.webp","image_profile.icc","icc",function(status,error){

       //if conversion successful status will be '100'
      //if conversion fails status will be '101'
      console.log(status,error);    

});

Extract ICC profile,XMP metadata and EXIF metadata

var webp=require('webp-converter');

//pass input image(.webp image) path ,output format(.icc,.xmp and .exif),get options(icc image profile,XMP metadata or EXIF metadata) and file.
//for options use keywords as below
//for ICC: icc
//for XMP metadata: xmp
//for EXIF metadata: exif

//webpmux_extract(input,output,option,result_callback)

webp.webpmux_extract("input.webp","output.icc","icc",function(status,error){

       //if conversion successful status will be '100'
      //if conversion fails status will be '101'
      console.log(status,error);    

});

Strip ICC profile,XMP metadata and EXIF metadata

var webp=require('webp-converter');

//pass input image(.webp image) path ,output image(without icc),options(icc image profile,XMP metadata or EXIF metadata) and file.
//for options use keywords as below
//for ICC: icc
//for XMP metadata: xmp
//for EXIF metadata: exif

//webpmux_strip(input,output,option,result_callback)

webp.webpmux_strip("input.webp","ouput.webp","icc",function(status,error){

      //if conversion successful status will be '100'
      //if conversion fails status will be '101'
      console.log(status,error);    

});

Create an animated WebP file from Webp images

var webp=require('webp-converter');

//pass input images(.webp image) path with FRAME_OPTIONS, as array,ouput image will be animated .webp image 


/*FRAME_OPTIONS

-file_i +di[+xi+yi[+mi[bi]]]

e.g -frame one.webp +100 -frame two.webp +100+50+50 -frame three.webp +100+50+50+1+b 

Where: file_i is the i'th frame (WebP format), xi,yi specify the image offset for this frame, 
di is the pause duration before next frame, mi is the dispose method for this frame (0 for NONE or 1 for BACKGROUND) and bi is the blending method for this frame (+b for BLEND or -b for NO_BLEND). 
Argument bi can be omitted and will default to +b (BLEND). Also, mi can be omitted if bi is omitted and will default to 0 (NONE). Finally, 
if mi and bi are omitted then xi and yi can be omitted and will default to +0+0.

-loop n

e.g 10

Loop the frames n number of times. 0 indicates the frames should loop forever. Valid range is 0 to 65535 [Default: 0 (infinite)].

-bgcolor A,R,G,B 

e.g 255,255,255,255

Background color of the canvas. Where: A, R, G and B are integers in the range 0 to 255 specifying the Alpha, Red, Green and Blue component values respectively [Default: 255,255,255,255].
*/

//webpmux_animate(input_images_array,output,bgcolor,result_callback)

var input=["./frames/tmp-0.webp +100","./frames/tmp-1.webp +100+50+50","./frames/tmp-2.webp +100+50+50+1+b"];

webp.webpmux_animate(input,"anim_container.webp","10","255,255,255,255",function(status,error)
  {
       //if conversion successful status will be '100'
      //if conversion fails status will be '101'
      console.log(status,error);    
  });

Get a frame from an animated WebP file

var webp=require('webp-converter');

//pass input image(.webp image) path ,output image and frame number

//webpmux_getframe(input,ouput,frame number,result_callback)

webp.webpmux_getframe("anim_container.webp","output.webp","2",function(status,error){

       //if conversion successful status will be '100'
      //if conversion fails status will be '101'
      console.log(status,error);    

});

Installation

$ npm install webp-converter

License

MIT

Repository

https://github.com/scionoftech/webp-converter.git


上一篇:tmodjs
下一篇:jdf

相关推荐

  • 🚀webpack 4 beta — try it today!🚀

    Now that webpack is a 0CJS (Zero Configuration) outofthebox bundler, we will lay groundwork in 4.x a...

    2 年前
  • 🔥一步一步的带你走进Webpack4的世界

    前言 webpack是当下最热门的前端资源模块化管理和打包工具,它可以将许多松散的模块按照依赖和规则打包成符号生产环境部署的前端资源,还可以将按需加载的模块进行代码分割。

    4 个月前
  • (独家!)webpack 5 changelog 全文翻译

    ★ webpack 团队于北京时间 10 月 12 日凌晨发布了 版本,本文译自 。此部分主要面向非插件开发的 webpack 使用者。 ” 简要说明 此版本重点关注以下内容: ...

    9 个月前
  • 面试必备!webpack 中那些最易混淆的 5 个知识点

    前两天为了优化公司的代码打包项目,恶补了很多 webpack4 的知识。要是放在几年前让我学习 webpack 我肯定是拒绝的,之前看过 webpack 的旧文档,比我们内部项目的文档还要简陋。

    1 年前
  • 面试官:请手写一个webpack4.0配置

    确认过眼神,你还是没有准备秋招的人?时间仓促。自京东6月8号开启管培生的招聘,就意味着秋招的开始。然而你还在等着秋天的到来?今年形势应该更为严峻,随着各大技术(vue,webpack,react,微信...

    2 年前
  • 随着WebPACK定义全局变量

    随着WebPACK定义全局变量...

    2 年前
  • 配置webpack中externals来减少打包后vendor.js的体积

    在日常的项目开发中,我们会用到各种第三方库来提高效率,但随之带来的问题就是打包后的vendor.js体积过大,导致加载时空白页时间过长,给用户的体验太差。为此我们需要减少vendor.js的体积,从本...

    2 年前
  • 配置webpack中dev.env.js、prod.env.js,解决不同命令下项目启动和打包到指定的环境

    前后端分离的项目开发中,我们有开发环境、测试环境、预生产环境和生产环境。 1、开发环境下调试接口的时候,一般都会有好几个接口地址(开发服务器上的,本地的,接口开发人员的,七七八八的接口地址),要根...

    2 年前
  • 配置WebPACK允许浏览器调试

    Jim(https://stackoverflow.com/users/1481240/jim)提出了一个问题:Configure webpack to allow browser debugging...

    2 年前
  • 通过webpack构建library库

    构建 library webpack 除了打包应用程序代码,还可以用于打包 JavaScript library 应用场景 提炼高可服用工具类 code 构建 UI 库 根据业务需求,在其他 UI ...

    1 个月前

官方社区

扫码加入 JavaScript 社区