How to convert HTML to pdf in NodeJS
Follow the following steps to convert HTML to pdf
Step 1 - install the pdf creator packages by the following command
$ npm i pdf-creator-node --save
Step 2 - Add required packages and read HTML template
//Required package
var pdf = require("pdf-creator-node");
var fs = require('fs');
// Read HTML Template
var html = fs.readFileSync('template.html', 'utf8');
Step 3 - Create your HTML Template
<!DOCTYPE html>
<html>
<head>
<mate charest="utf-8" />
<title>Hello world!</title>
</head>
<body>
<h1>User List</h1>
<ul>
{{#each users}}
<li>Name: {{this.name}}</li>
<li>Age: {{this.age}}</li>
<br>
{{/each}}
</ul>
</body>
</html>
Step 4 - Provide Format and Orientation as per your need
"height": "10.5in", // allowed units: mm, cm, in, px "width": "8in", // allowed units: mm, cm, in, px
OR
"format": "Letter", // allowed units: A3, A4, A5, Legal, Letter, Tabloid "orientation": "portrait", // portrait or landscape
var options = {
format: "A3",
orientation: "portrait",
border: "10mm",
header: {
height: "45mm",
contents: '<div style="text-align: center;">Author: Shyam Hajare</div>'
},
"footer": {
"height": "28mm",
"contents": {
first: 'Cover page',
2: 'Second page', // Any page number is working. 1-based index
default: '<span style="color: #444;">{{page}}</span>/<span>{{pages}}</span>', // fallback value
last: 'Last Page'
}
};
Step 5 - Provide HTML, User data and pdf path for the output
var users = [
{
name:"Shyam",
age:"26"
},
{
name:"Navjot",
age:"26"
},
{
name:"Vitthal",
age:"26"
}
]
var document = {
html: html,
data: {
users: users
},
path: "./output.pdf"
};
Step 6 - After setting all parameters just pass document and options to the pdf.create method.
pdf.create(document, options)
.then(res => {
console.log(res)
})
.catch(error => {
console.error(error)
});
Reference
Please refer the following link if you want to use condition in HTML template
Full Stack Developer
1 年Hi Hajare, Thanks for your package. I have been trying this for a long while to figure this out.. Your each statement is working for the data passed through as an array.. For an instance, if i am passing this as an object then it doesn't print the value of it.. example : data:{invoice;{invoice_date:"29-05-2023"}}; then in the html template i added like {{invoice.invoice_date}}.. Prints nothing ?nested properties is not working Please let me know.TIA
Technical Manager at Indexnine Technologies
4 年Nice! Useful one, Shyam!