Generate pdf of the ionic html page

Ionic Framework ionic-v3
1

I tried using pdfmake to generate pdf but was unsuccessful.
Can anyone suggest any client side way to implement the generation of pdf from the ionic html page.
Thanks in advance

2

I’m using pdfMake with Ionic 2 and I find it the easiest way to generate PDFs. Although it doesn’t support PDF generation directly from HTML, you should give it a try. You could use the following structure to mimic HTML tags:

var docDefinition = {
  content: [
    {
      text: 'My title',
      style: 'h1'
    } 
  ],
  styles: {
    title: {
      fontSize: 18,
      bold: true,
      decoration: 'underline'
    }
  }
};
3

Can I ask what you did to get pdfmake in your i2 app? was it a simple npm i --save or did you mess with index.html?? What version of Ionic 2 are you using?

Thanks

4

Unfortunately I couldn’t make it work with installing it directly from npm. I added the library manually. If anyone can make it work using npm and TS declaration, I would be happy to adapt it as well.

  1. Download the pdfmake GitHub repo.
  2. Copy the files pdfmake.min.js, pdfmake.min.js.map and vfs_fonts.js from pdfmake-master/build/ to ionic-project/src/assets/lib/pdfmake (or any desired folder inside src/assets)
  3. Reference the files in ionic-project/src/index.html 
<script src="assets/lib/pdfmake/pdfmake.min.js"></script>
<script src="assets/lib/pdfmake/vfs_fonts.js"></script>
  1. Declare the variable pdfMake in any TypeScript file you need the library.
declare var pdfMake: any;
1 Like
5

great, that does the job

6

public gerarPDF(){
let texto = {
content: ‘PDF ORÇAMENTO 00001’
}
this.pdfMake.createPdf(texto).open();
}

not run ,why ?