PDFJSExpress + custom webviewer-ui.min.js

Technical Support
6

Update:
Resolved. The issue was the differences in index.html:

Original:

...
<body>
  <div id="app"></div>
  <div id="line-connector-wrapper">
    <div id="line-connector-root"></div>
  </div>
  <script src="../core/CoreControls.js"></script>
  <script src="../core/pdfjs/PDFJSDocumentType.js"></script>
  <script src="../core/pdfjs/UIConfig.js"></script>
  <script src="webviewer-ui.min.js"></script>
</body>
...

Replacement:

...
<body>
  <div id="app"></div>
  <div id="line-connector-wrapper">
    <div id="line-connector-root"></div>
  </div>
  <div id="outline-edit-popup-portal"></div>
  <script src="../core/CoreControls.js"></script>
  <script src="webviewer-ui.min.js"></script>
</body>
...

So basically I replaced everything within the ui folder except for index.html and now it works. I think it would probably be good to have this entire procedure in the docs :slight_smile:

If I run into any more issues and/or have other question, do you mind if I just post in this thread, or should I open a new one?

Thanks.

Hi, so this doesn’t actually work for me. [Resolved] I’ll try to give you as many details as possible.

Dev environment:
I pulled webviewer-ui from Github as described in docs, branch 7.3, and got it to run. I implemented a feature we needed (not many changes, PR here - 7.3 nucleus by GTCrais · Pull Request #1 · GTCrais/webviewer-ui · GitHub), everything works in the dev environment. I then ran npm run build which created the build folder with everything in it:

build_folder

This is the console output in dev env, no issues:

dev_console

Production environment:
As we discussed here, I copied the contents of the build folder and pasted it into node_modules/@pdftron/pdfjs-express/public/ui, which replaced the original files there. I made sure I’m running the same version of UI and Core, which is 7.3.3. After running npm run dev, everything builds fine, PDFJSExpress initializes, but then it breaks when trying to load a document. I also tried running (my custom) UI v7.3.3 with Core v7.3.5 but I got the same error.

Console output:

prod_console
prod_console740×349 23.7 KB

Viewer stuck at loading:

viewer_stuck
viewer_stuck1037×753 8.01 KB

When I just install PDFJSExpress directly through npm and don’t replace the viewer with my modified one (so just pull "@pdftron/pdfjs-express": "7.3.3" through npm), everything works as expected.

Please advise. Thanks!