angular - 如何在 Angular CLI 应用程序中提供 pdf.js worker

Question

出于某些 pdf 目的，我直接在 angular 应用程序中使用了 pdf.js。它工作正常。

我从 pdfjs-dist 导入了 pdfjs，我的 package.json 包含 pdfjs-dist。

我的 pdf 工作正常，但在控制台中，我收到以下错误。

pdf.js:9067 GET http://localhost:4300/main.bundle.worker.js 404 (Not Found)

pdf.js:351 Warning: Setting up fake worker.

如何在 Angular CLI 应用程序中正确设置 worker？

Answer 1

我通过几天的战斗解决了这个问题。
我第一次使用 StackBlitz 在线 Angular6 服务获胜。但是在家里重复有问题。

就我而言，可以将 Angular 6 和 CLI 与本地文件一起使用。
PS:当您使用本地安装和带有外部链接(如 CDN 等)的 worker 时，请注意 pdf.js 和 pdf.worker.js 的类似版本(我使用 pdf.worker.min.js)。

从 CDN 获得我需要的版本 https://www.jsdelivr.com/package/npm/pdfjs-dist?path=build

把你的 pdf.worker.js 或 pdf.worker.min.js 放到/src/assets/
然后使用:

import * as pdfjsLib from 'pdfjs-dist/build/pdf
pdfjsLib.GlobalWorkerOptions.workerSrc = './assets/pdf.worker.min.js';

规范:
得到命令'ng version'

Angular CLI: 6.0.3
Node: 8.10.0
OS: linux x64
Angular: 6.0.2

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.6.3
@angular-devkit/build-angular     0.6.3
@angular-devkit/build-optimizer   0.6.3
@angular-devkit/core              0.6.3
@angular-devkit/schematics        0.6.3
@angular/cli                      6.0.3
@ngtools/webpack                  6.0.3
@schematics/angular               0.6.3
@schematics/update                0.6.3
rxjs                              6.1.0
typescript                        2.7.2
webpack                           4.8.3