Angular2: How to use pdfmake library : <p>Trying to use client-side pdf library <a href="https://github.com/bpampuch/pdfmake" rel="noreferrer">pdfmake</a> in my Angular 2 (version=4.2.x) project.</p>

<p>In .angular-cli.json file, I declared js like this:</p>

<pre><code>"scripts": [
    "../node_modules/pdfmake/build/pdfmake.js",
    "../node_modules/pdfmake/build/vfs_fonts.js"
  ]
</code></pre>

<p>And then in app.component.ts, I used it like this:</p>

<pre><code>import * as pdfMake from 'pdfmake';

@Component({
selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit {
   pdf: any;
   downloadPdf() {
    let item = {firstName: 'Peter', lastName: 'Parker'};
    this.pdf = pdfMake;
    this.pdf.createPdf(buildPdf(item)).open();
  }
}

function buildPdf(value) {
   var pdfContent = value;
   var docDefinition = {
     content: [{
    text: 'My name is: ' + pdfContent.firstName  + ' ' + pdfContent.lastName + '.'
     }]
   }
   console.log(pdfContent);
   return docDefinition;
}
</code></pre>

<p>I hit below error in browser console when loading the app:</p>

<pre><code>Uncaught TypeError: fs.readFileSync is not a function
at Object.&lt;anonymous&gt; (linebreaker.js:15)
at Object.&lt;anonymous&gt; (linebreaker.js:161)
at Object.../../../../linebreak/src/linebreaker.js (linebreaker.js:161)
at __webpack_require__ (bootstrap b937441…:54)
at Object.../../../../pdfmake/src/textTools.js (textTools.js:4)
at __webpack_require__ (bootstrap b937441…:54)
at Object.../../../../pdfmake/src/docMeasure.js (docMeasure.js:4)
at __webpack_require__ (bootstrap b937441…:54)
at Object.../../../../pdfmake/src/layoutBuilder.js (layoutBuilder.js:7)
at __webpack_require__ (bootstrap b937441…:54)
</code></pre>

<p>My workaround for solving this problem is: </p>

<p>Copy pdfmake.js and vfs_fonts.js to assets folder, and then add this to index.html:</p>

<pre><code>&lt;script src='assets/pdfmake.min.js'&gt;&lt;/script&gt;
&lt;script src='assets/vfs_fonts.js'&gt;&lt;/script&gt;
</code></pre>

<p>Remove this from app.component.ts</p>

<pre><code>import * as pdfMake from 'pdfmake';
</code></pre>

<p>And add this to app.component.ts:</p>

<pre><code>declare var pdfMake: any;
</code></pre>

<p>Finally remove this from .angular-cli.js:</p>

<pre><code>"../node_modules/pdfmake/build/pdfmake.js",
"../node_modules/pdfmake/build/vfs_fonts.js"
</code></pre>

<p>It works but it's still a workaround.</p>

<p>Anyone knows how to use this library in Angular/Typscript way?</p>

<p>Thanks a lot!</p>
