node-html-to-image v1.2 is out 🎉
Tags: showdev, node, javascript, webdev
Published: 2020-03-27 11:03:54

Sometime ago, I wrote a small module called [node-html-to-image](https://github.com/frinyvonnick/node-html-to-image). It generates images from HTML in Node.js. For more information, here is an [article](https://dev.to/yvonnickfrin/generate-images-from-html-in-node-js-8p5) that explains how to use it. This week, it has been featured in [NodeWeekly](https://nodeweekly.com/issues/331) :tada:

This week, I also released version 1.2. Let's see what's new in `node-html-to-image`.

## :sparkles: Transparency support

This feature was asked by [jordan314](https://github.com/jordan314). It wasn't possible to have a transparent background for `png` images. Here is an example to achieve it with the new `transparent` option:

```js
const nodeHtmlToImage = require('node-html-to-image')

nodeHtmlToImage({
  output: './image.png',
  type: 'png',
  transparent: true,
  html: '<html><body>Hello world!</body></html>'
})
  .then(() => console.log('The image was created successfully!'))
```

## :memo: Improve documentation

Users frequently asked me two questions about `node-html-to-image` usage:

- How to use locally stored images?
- How to set my image resolution?

I added two sections directly in the README that answer these questions ([image resolution](https://github.com/frinyvonnick/node-html-to-image#setting-output-image-resolution) and [dealing with images](https://github.com/frinyvonnick/node-html-to-image#dealing-with-images)).

I hope it will help :pray:

## :recycle: Simplify test setup

I use [tesseract](https://tesseract-ocr.github.io/) to test the module works fine. It was tricky to install the engine on your computer in order to run tests. I moved to [tesseract.js](https://tesseract.projectnaptha.com/) which is a Javascript port of this OCR engine. Running yarn installation command is now enough to setup the project before running tests.

## :computer: The CLI has been released too!

`node-html-to-image` has its own [CLI](https://github.com/frinyvonnick/node-html-to-image-cli). I think it is a good way to quickly give a try to the module. 

![node-html-to-image-cli demo](https://raw.githubusercontent.com/frinyvonnick/node-html-to-image-cli/master/misc/demo.gif)

### What's new in `node-html-to-image-cli` v1.1:

#### Add an option to provide content

It is now possible to use `handlebars` with the CLI too. Here is an example:

```sh
npx node-html-to-image-cli ./index.html ./image.png --content ./content.json
```
index.html:
```html

<!DOCTYPE html>
<html>
  <body>
    <h1>Hello {{you}}</h1>
  </body>
</html>
```
content.json:
```json
{ 
  "you": "world"
}
```

Thanks to [Julien Tanguy](https://github.com/jtanguy) :pray:

#### Add an option to support transparency

I also added an option `transparent` to enable support of transparency in the CLI too:

```sh
npx node-html-to-image-cli --type png --transparent ./index.html ./image.png
```

Feel free check out the GitHub repositories if you are interested:

- [node-html-to-image](https://github.com/frinyvonnick/node-html-to-image)
- [node-html-to-image-cli](https://github.com/frinyvonnick/node-html-to-image-cli)

Want to support ? Don't forget to leave a ⭐️

<hr/>

Feedback or ideas are appreciated 🙏 Please tweet me if you have questions [@YvonnickFrin](https://twitter.com/YvonnickFrin)!