Auto setting the width and height of <img>
Switch branches/tags
Clone or download
Latest commit ee2068c Jun 28, 2018

README.md

posthtml-img-autosize npm version Build Status

PostHTML plugin that automatically sets width and height of <img>. It supports JPG, PNG, GIF, BMP, TIFF, SVG, and WebP. It autosizes both local and remote images.

Usage

By default the plugin will autosize only images with width="auto" and height="auto":

var posthtml = require('posthtml');

posthtml([require('posthtml-img-autosize')()])
    .process('<img src="photo.png" width="auto" height="auto"><img src="user.jpg">')
    .then(function (result) {
        console.log(result.html);
    });

// <img src="photo.png" width="111" height="52">
// <img src="user.jpg">

But if you set processEmptySize: true, the plugin will autosize all images with undefined or empty width and height:

posthtml([
    require('posthtml-img-autosize')({
        root: './', // Path to images base directory (default: './')
        processEmptySize: true
    })
])
    .process('<img src="photo.png" width="auto" height="auto"><img src="user.jpg">')
    .then(function (result) {
        console.log(result.html);
    });

// <img src="photo.png" width="111" height="52">
// <img src="user.jpg" width="100" height="201">

Error handling

You can use the usual Promise.catch() to handle errors:

posthtml([require('posthtml-img-autosize')()])
    .process('<img src="notExists.jpg" width="auto" height="auto">')
    .then(function (result) {
        // ...
    })
    .catch(function (error) {
        console.log(error.message);
    });

// ENOENT: no such file or directory, open '/notExists.jpg'