mozilla / pdf.js

PDF Reader in JavaScript
https://mozilla.github.io/pdf.js/
Apache License 2.0
48.31k stars 9.97k forks source link

4.0.189: Top-level await is not available in the configured target environment ("chrome87", "edge88", "es2020", "firefox78", "safari14" + 2 overrides) #17245

Closed jiadesen closed 11 months ago

jiadesen commented 11 months ago

Attach (recommended) or Link to PDF file here: any

Configuration:

  VITE v4.5.0  ready in 457 ms

  ➜  Local:   http://localhost:5273/pdf/
  ➜  Network: http://192.168.10.13:5273/pdf/
  ➜  press h to show help

✘ [ERROR] Top-level await is not available in the configured target environment ("chrome87", "edge88", "es2020", "firefox78", "safari14" + 2 overrides)

    node_modules/.pnpm/pdfjs-dist@4.0.189/node_modules/pdfjs-dist/build/pdf.mjs:16837:53:
      16837 │ /******/ __webpack_exports__ = globalThis.pdfjsLib = await __webpack_exports__;
            ╵                                                      ~~~~~

4:46:45 PM [vite] error while updating dependencies:
Error: Build failed with 1 error:
node_modules/.pnpm/pdfjs-dist@4.0.189/node_modules/pdfjs-dist/build/pdf.mjs:16837:53: ERROR: Top-level await is not available in the configured target environment ("chrome87", "edge88", "es2020", "firefox78", "safari14" + 2 overrides)
    at failureErrorWithLog (/Users/xxx/node_modules/.pnpm/esbuild@0.18.20/node_modules/esbuild/lib/main.js:1649:15)
    at /Users/xxx/node_modules/.pnpm/esbuild@0.18.20/node_modules/esbuild/lib/main.js:1058:25
    at /Users/xxx/node_modules/.pnpm/esbuild@0.18.20/node_modules/esbuild/lib/main.js:1525:9
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
MikeDabrowski commented 3 months ago

That's ok. I used cdn url and that worked. It broke in playwright tests so for that I used the assets url.

This seems to be angular related issue.

On Wed, 10 Jul 2024, 00:03 JHarrisGTI, @.***> wrote:

@MikeDabrowski https://github.com/MikeDabrowski I have not seen such an error. ☹️ If pdf.worker.min.mjs is in your assets folder, I don't know why pdf.js would be unable to see it. Sorry I can't be more help.

— Reply to this email directly, view it on GitHub https://github.com/mozilla/pdf.js/issues/17245#issuecomment-2218807083, or unsubscribe https://github.com/notifications/unsubscribe-auth/AEICW36RQJNZFS6V7ONNOZ3ZLRM23AVCNFSM6AAAAAA7EGAPAKVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDEMJYHAYDOMBYGM . You are receiving this because you were mentioned.Message ID: <mozilla/pdf .@.***>

xander90 commented 2 months ago

@JHarrisGTI

pdfJsLib.GlobalWorkerOptions.workerSrc = 'assets/pdf.worker.min.mjs';

I did that too, my deployed assets contain the worker file but the src like that cant use it.

Error: Setting up fake worker failed: "Failed to resolve module specifier 'assets/pdf.worker.min.mjs'"

Have you seen such error?

Even if I put the full url to this file - the error is Failed to fetch dynamically imported module

This worked for me, using angular@18.1.3 & pdfjs-dist@4.5.136 I get vite's warning when ng serve is running

11:21:03 [vite] warning: 
.../.angular/cache/18.1.3/vite/deps/pdfjs-dist.js
11783|        const worker = yield import(
11784|          /*webpackIgnore: true*/
11785|          this.workerSrc
   |          ^^^^^^^^^^^^^^
11786|        );
11787|        return worker.WorkerMessageHandler;
The above dynamic import cannot be analyzed by Vite.
See https://github.com/rollup/plugins/tree/master/packages/dynamic-import-vars#limitations for supported dynamic import formats. If this is intended to be left as-is, you can use the /* @vite-ignore */ comment inside the import() call to suppress this warning.

  Plugin: vite:import-analysis
  File: .../.angular/cache/18.1.3/vite/deps/pdfjs-dist.js?v=0c2fc72a

but all work fine

import {getDocument, GlobalWorkerOptions, PDFPageProxy} from "pdfjs-dist";

private async tryToGetPdf(pdfFile: File) {
     GlobalWorkerOptions.workerSrc = 'assets/pdf-worker/build/pdf.worker.min.mjs';
     const arrayBuffer = await pdfFile.arrayBuffer();
     const loadingTask = getDocument(arrayBuffer);
     ....
}
christianhyltoft commented 1 week ago

I still face the excact same issues as described above and in many other threads. My API version and worker version doesnt match, but whenver i would upgrade or downgrade either the worker or the pdfjs-dist then it is still not resolved.

I have tried to follow along on multiple suggestions and tried countless versions but I still cant seem to get it to work.

This is something that I am trying to do in React, NextJs and TypeScript.

Is there a posibility to get someone to help or perhaps pairprogram it with me since i feel like it is a lost cause...?