Giter VIP home page Giter VIP logo

to-pdf's Introduction

convert-to-pdf

Convert html to pdf using puppeteer

The module converts the given HTML template to PDF. The module uses puppeteer for creating PDFs and mustache for templates

Soon to come: ejs to PDF

Methods

  • htmlToPdf

        htmlToPdf(options: HtmlToPdfOptions): Promise<Buffer>

Options available

const options = {
    // executable path for Puppeteer. Default path provided by puppeteer will be used if this option is not provided.
    puppeteerExecPath: 'Puppeteer executable path',
    // page options(used for rendering the content via puppeteer)
    page: { // OPTIONAL
        height: height of page - number - (default: 1600),
        width: width of page - number - (default: 745.60),
    },
    // PDF options(used while creating the PDF)
    pdf: { // OPTIONAL
        writeStream: for stream of PDF - NodeJS.WritableStream - (default: none(i.e. return PDF as Buffer)),
        path: The path to save the file to - string - If the path is relative, it's resolved relative to the current working directory - (default: '' which means the PDF will not be written to disk),
        dimensions: { will be ignored if format option is provided
          width: PDF width in pixes - number or string with px as unit - Example: 300 or '300px',
          height: PDF height in pixes - number or string with px as unit - Example: 300 or '300px',
        },
        scale: Scale of the webpage rendering - number - (default: 1) - value must be  between 0.1 and 2,
        format: Paper format - PaperFormat,
        landscape: Paper orientation - boolean - (default: false),
        margin: Paper margin - object - (default: none) - keys: top, bottom, right, left,
        printBackground: Print Page background on PDF? - boolean - (default: false),
        transparentBackground: Transparent background on PDF? - boolean - (default: false),
    },
    // Template options(used while rendering by puppeteer)
    template: {
      type: Type of html template - string - values: FILE/CONTENT - (default: CONTENT)
      content: html template - string - (file path if type is FILE or HTML string if type is CONTENT)
      css: {
          type: Type of css content - string - values: FILE/CONTENT/URL - (default: CONTENT),
          content: css style sheet - string - (file path if type is FILE or CSS string if type is CONTENT or URL )
      },
      script: {
          type: Type of script content - string - values: FILE/CONTENT/URL - (default: CONTENT),
          content: javascript code - string - (file path if type is FILE or code string if type is CONTENT or URL )
      },
      header: HTML template for the print header. Should be valid HTML markup. the following classes can be used to inject printing values:
        - `date` formatted print date
        - `title` document title
        - `url` document location
        - `pageNumber` current page number
        - `totalPages` total pages in the document
      footer: HTML template for the print footer. Should use the same format as the header.
      partials: MustacheJs partials (sub-templates) - Object<string, string> - Example - {
        [templateName]: [template content]
      }
    },
    // Url options
    url: {
      link: URL to render - string
      auth: Authentication for the given url(if required) - object - keys: username, password
    }
    data: Data to render on template - object,
    // Additional data to render on template. For example, Can be used to provide translations on the template. Check the second example below
    additionalData: {
      resourceType: Type of resource data - string - values: FILE/CONTENT - (default: CONTENT),
      data: Data to render - object | string - (file path if type is FILE or JSON object if type is CONTENT )
    }
}

At least one of template or url must be specified.

For more information about the options, see the documentation for puppeteer here

Examples

import { htmlToPdf } from 'convert-to-pdf';

const options = {
  // template options
  template: {
    type: 'FILE', // If the template is in the form of a file
    content: path.resolve(__dirname, 'index.html'),
    css: {
      type: 'FILE',
      content: path.resolve(__dirname, 'index.css'),
    },
  },
  // data to render on the template
  data: {
    name: 'John Doe',
  },
};
const pdf = await htmlToPdf(options);
// here pdf is in the form of Buffer
import { htmlToPdf } from 'convert-to-pdf';

const options = {
  pdf: {
    writeStream: res, // http response as writable stream
  },
  // template options
  template: {
    type: 'CONTENT', // If the template in in the form of a file
    content: `
    <!DOCTYPE html>
      <html>
      <head>
          <meta charset='utf-8'>
          <meta http-equiv='X-UA-Compatible' content='IE=edge'>
          <title>Page Title</title>
          <meta name='viewport' content='width=device-width, initial-scale=1'>
      </head>
      <body>
          <h1>{{HELLO}} {{name}}!</h1>
      </body>
    </html>
`,
    css: {
      type: 'CONTENT',
      content: `
        h1 {
          color: #f00;
        }
      `,
    },
  },
  // data to render on the template
  data: {
    name: 'John Doe',
  },
  // additional data, used here as translations key/value
  additionalData: {
    resourceType: 'CONTENT',
    data: {
      HELLO: 'Hej',
    },
  },
};
await htmlToPdf(options);
// Here PDF will be piped to the specified writable stream
  • getDataRenderedTemplate

        getDataRenderedTemplate(options: RenderOptions): Promise<string>

Options available

const options = {
    template: {
      type: Type of template - string - values: FILE/CONTENT - (default: CONTENT)
      content: template content - string - (file path if type is FILE or string if type is CONTENT)
    },
    data: Data to render on template - object,
    // Additional data to render on template. For example, Can be used to provide translations on the template. Check the example above
    additionalData: {
      resourceType: Type of resource data - string - values: FILE/CONTENT - (default: CONTENT),
      data: Data to render - object | string - (file path if type is FILE or JSON object if type is CONTENT )
    }
  }

to-pdf's People

Contributors

sunkkalp-kataria avatar sankalpkataria avatar

Stargazers

Marko Bolliger avatar Leonardo Cavalcante avatar Alex Tirim avatar Ali Molaei avatar Mikael Hellman avatar Balgopal Sharma avatar

Watchers

Mikael Hellman avatar  avatar

to-pdf's Issues

Type 'string' is not assignable to type 'TemplateContentType'.ts(2345)

Hi,
I am getting this error in await htmlToPdf(options); when I use the example code from the documentation:

  Type '{ pdf: { writeStream: fs.WriteStream; }; template: { type: string; content: string; css: { type: string; content: string; }; }; data: { name: string; }; additionalData: { resourceType: string; data: { HELLO: string; }; }; }' is not assignable to type 'RenderOptions'.
    The types of 'template.type' are incompatible between these types.
      Type 'string' is not assignable to type 'TemplateContentType'.ts(2345)

When I remove the code from line 3 till to 17 in https://github.com/sankalpkataria/to-pdf/blob/main/src/types.ts#L3
The error is gone and the pdf-file is exported without any problems.

Is there a better way to fix the issue?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.