Javascript 使用WebWorker时，从导入其他类的文件导入类会导致Angular 8的编译失败

我用的是角度v8。我有一个名为

model.ts

的文件，如下所示

import {map} from 'rxjs/operators';

export class Person {
 constructor() { }
}

/// <reference lib="webworker" />
import {Person} from './bo/model';

addEventListener('message', ({ data }) => {
  const response = `worker response to ${data}`;
  postMessage(response);
});

然后我有一个名为

test.worker.ts

的WebWorker文件，如下所示

import {map} from 'rxjs/operators';

export class Person {
 constructor() { }
}

/// <reference lib="webworker" />
import {Person} from './bo/model';

addEventListener('message', ({ data }) => {
  const response = `worker response to ${data}`;
  postMessage(response);
});

如果我从'rxjs/operators'中注释掉

import{map}，那么我就可以编译了。导入其他库的库是否有限制

有趣的是，如果我从'@angular/common/http'导入
import{HttpClient}然后我得到一个不同的错误，如下所示

ERROR in ./src/app/test.worker.ts (./node_modules/worker-plugin/dist/loader.js!./src/app/test.worker.ts)
Module build failed (from ./node_modules/worker-plugin/dist/loader.js):
Error: node_modules/@angular/core/core.d.ts(1470,29): error TS2304: Cannot find name 'Element'.
node_modules/@angular/core/core.d.ts(1471,29): error TS2304: Cannot find name 'Element'.
node_modules/@angular/core/core.d.ts(1538,26): error TS2304: Cannot find name 'Node'.
node_modules/@angular/core/core.d.ts(1539,29): error TS2304: Cannot find name 'Node'.
node_modules/@angular/core/core.d.ts(7082,33): error TS2304: Cannot find name 'Node'.
node_modules/@angular/core/core.d.ts(8711,81): error TS2304: Cannot find name 'HTMLElement'.
node_modules/@angular/core/core.d.ts(8822,15): error TS2304: Cannot find name 'HTMLElement'.
node_modules/@angular/core/core.d.ts(9753,62): error TS2304: Cannot find name 'Element'.
node_modules/@angular/core/core.d.ts(9755,62): error TS2304: Cannot find name 'Node'.
node_modules/@angular/core/core.d.ts(9778,59): error TS2304: Cannot find name 'Element'.
node_modules/@angular/core/core.d.ts(9820,82): error TS2304: Cannot find name 'HTMLElement'.
node_modules/@angular/core/core.d.ts(10214,83): error TS2304: Cannot find name 'HTMLElement'.
node_modules/@angular/core/core.d.ts(12863,20): error TS2304: Cannot find name 'Document'.
node_modules/@angular/core/core.d.ts(12866,13): error TS2304: Cannot find name 'HTMLElement'.
node_modules/@angular/core/core.d.ts(12874,20): error TS2304: Cannot find name 'Document'.
node_modules/@angular/core/core.d.ts(12877,13): error TS2304: Cannot find name 'Document'.
node_modules/@angular/core/core.d.ts(12885,20): error TS2304: Cannot find name 'Document'.
node_modules/@angular/core/core.d.ts(12888,13): error TS2304: Cannot find name 'Window'.

    at AngularCompilerPlugin._update (/Users/jwayne/my-app/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:767:31)
    at processTicksAndRejections (internal/process/task_queues.js:89:5)
    at async AngularCompilerPlugin._make (/Users/jwayne/my-app/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:658:13)
./src/app/test.worker.ts（./node_modules/worker plugin/dist/loader.js./src/app/test.worker.ts）中出错
模块构建失败（来自./node\u modules/worker plugin/dist/loader.js）：
错误：node_modules/@angular/core/core.d.ts（1470,29）：错误TS2304:找不到名称“Element”。
node_modules/@angular/core/core.d.ts（1471,29）：错误TS2304:找不到名称“Element”。
node_modules/@angular/core/core.d.ts（1538,26）：错误TS2304:找不到名称“node”。
node_modules/@angular/core/core.d.ts（1539,29）：错误TS2304:找不到名称“node”。
node_modules/@angular/core/core.d.ts（7082,33）：错误TS2304:找不到名称“node”。
node_modules/@angular/core/core.d.ts（8711,81）：错误TS2304:找不到名称“HTMLElement”。
node_modules/@angular/core/core.d.ts（8822,15）：错误TS2304:找不到名称“HTMLElement”。
node_modules/@angular/core/core.d.ts（9753,62）：错误TS2304:找不到名称“Element”。
node_modules/@angular/core/core.d.ts（9755,62）：错误TS2304:找不到名称“node”。
node_modules/@angular/core/core.d.ts（9778,59）：错误TS2304:找不到名称“Element”。
node_modules/@angular/core/core.d.ts（9820,82）：错误TS2304:找不到名称“HTMLElement”。
node_modules/@angular/core/core.d.ts（10214,83）：错误TS2304:找不到名称“HTMLElement”。
node_modules/@angular/core/core.d.ts（12863,20）：错误TS2304:找不到名称“Document”。
node_modules/@angular/core/core.d.ts（12866,13）：错误TS2304:找不到名称“HTMLElement”。
node_modules/@angular/core/core.d.ts（12874,20）：错误TS2304:找不到名称“Document”。
node_modules/@angular/core/core.d.ts（12877,13）：错误TS2304:找不到名称“Document”。
node_modules/@angular/core/core.d.ts（12885,20）：错误TS2304:找不到名称“Document”。
node_modules/@angular/core/core.d.ts（12888,13）：错误TS2304:找不到名称“Window”。
在AngularCompilerPlugin.更新（/Users/jwayne/my app/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:767:31）
在处理和拒绝时（内部/process/task_queues.js:89:5）
异步AngularCompilerPlugin._make（/Users/jwayne/my app/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:658:13）
更有趣的是，如果import
import{Observable，of}来自'rxjs'那么我绝对不会出错！这是怎么回事

请注意，我使用的是ng cli v8.0.2。
我不确定
rxjs/operators
导入有什么问题，但我知道
HttpClient
导入有什么问题

问题是Web工作人员无法访问DOM（）。您不能使用
@angular/common
，因为它访问DOM。我正在处理一个类似的问题（我试图在我的worker中使用管道，它从
@angular/common
导入）。这非常令人沮丧，因为我使用的
@angular/common
的方法和类与DOM无关。到目前为止，我发现的唯一可能的解决方案是在工作程序之外（如果可能的话）处理处理DOM的库

TL；DR：您无法在web worker中访问DOM，甚至无法使用访问DOM的库，因此，如果可能，请在worker之外进行访问

编辑：更好的解释是，不仅仅是web工作人员无法访问DOM，他们也无法访问DOM以确保线程安全。（）和（）。
FWIW，我现在的一个解决方法是将依赖于这些外部库（包括角度库）的所有代码重构到它们自己的文件中。我意识到web worker在自己的线程中运行，因此它与Angular应用程序不共享内存；虽然您可能会导入类，但状态已丢失，您必须将它们序列化到web worker，然后重新创建/实例化对象。我想知道您是否可以将您的工作作为要点或其他内容共享。