How to load Webviewer using ES6 modules and imports

[Laurent Biancardini]

Hi,

How do you use the ES6 modules system to import Webviewer please ?

In your example you initialise the Webviewer in the main html file like this :
<script src="jquery-1.7.2.min.js"></script>
<script src="lib/WebViewer.js"></script>
...

However I'd like to initialise the Webviewer in a JS file like this:
import PDFTron from './lib/WebViewer.js'.

and it doesn't seem to work for me. Do you have any idea how can I fix it please ?

Thanks in advance,

[Matt Parizeau]

Hi,

If you want to import it like an ES6 module you'll have to modify the WebViewer.js file so that it exports the PDFTron variable. I believe it may be as simple as adding the line export default PDFTron; at the end of the file. For jQuery I believe you can install it from npm (https://www.npmjs.com/package/jquery) and then you'll need to import it at the top of the WebViewer.js file import $ from 'jquery';

Matt Parizeau

Software Developer

PDFTron Systems Inc.

[Laurent Biancardini]

Thanks Matt.

I will modify the WebViewer document as you suggested. Have a great day.