How do you use pdfjs-dist with Angular Elements for Internet Explorer

  angular, angular-elements, pdf.js, pdfjs-dist

How do you correctly import pdfjs-dist and use the es5 version for Internet Explorer?

I am using Angular 8 and Custom Elements, what I have done so far is

npm install --save pdfjs-dist

Then in my component I import the script:

import * as pdfjs from 'pdfjs-dist'

and then I will create a variable

pdfjs: any

and use the functions like

this.pdfjs.getDocument()

This will work perfectly fine for Chrome, but in IE will get errors like Object action not supported. Which is expected I guess because it’s not using the es5 files.

I tried to modify the pdfjs-dist in the node modules to resolve to the es5 folder, but at the end when I load my component I got an error saying Weakset undefined or something like that.

I also tried manually imported the scripts dynamically and append it by using document.createElement(‘script’) and document.getElementsByTagName("head")[0].appendChild(sc). This method will work the best, but performance wise it’s very bad because it needs to wait for the scripts to finish loading before you can actually do anything.

What is the proper way to use this package for IE?? The documentation for this library and Internet Explorer itself are just absolutely trash.

Source: Angular Questions

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.