角度应用程序的polyfill,使用从CLI创建的网络工作者

问题描述 投票:1回答:1

我有一个需要在客户端进行大量数据过滤的应用程序,这就是为什么必须使用Web Worker来保持UI平滑的原因。我有一个网络工作者正在为我的一个过滤器工作,而IE的问题是我的打字稿无法为该网络工作者编译到es5。

我已经在网上和堆栈上阅读过,因为网络工作者将在单独的执行上下文上运行,因此他们将无法访问angular的polyfill。

我知道我的网络工作者正在IE11中运行,因为我可以登录网络工作者上下文并在控制台中查看它。我也收到此错误,这意味着我的ts无法转换为正确的js版本。

Error from worker

我尝试过的是针对Mozilla文档中的特定错误手动添加polyfill,但它不起作用。

如果有人对此有任何见识,将不胜感激:D

这是我的工作者的tsconfig

{
  "extends": "./tsconfig.json",
  "compilerOptions": {
    "outDir": "./out-tsc/worker",
    "lib": [
      "ES2018",
      "webworker"
    ],
    "target": "es5",
    "types": []
  },
  "include": [
    "src/**/*.worker.ts"
  ]
}

这是我的角度应用程序的全局tsconfig文件

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "module": "esnext",
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "typeRoots": [
      "node_modules/@types",
      "node"
    ],
    "lib": [
      "es2018",
      "dom"
    ],
    "resolveJsonModule": true,
  }
}

这是我的工作人员进行了一些过滤

/// <reference lib="webworker" />

addEventListener('message', ({ data }) => {

  let filteredData = data[0];
  const params = data[1];
  const excludedFilters = ['level', 'sol_id', 'dac_name'];
  const location = params['dac_name'];

  for (let param of Object.entries(params)) {
    const key = param[0] as string;
    const val = param[1] as string;

    if (!excludedFilters.includes(key)) {
      filteredData = data[0].filter(obj => obj[key] === val)
    }
  }

  if (location) {
    if (location != 'All Data Centres') {
      filteredData = filteredData.filter(obj => obj['dac_name'] === location)
    }
  }

  postMessage(filteredData)
});

编辑:手动包括polyfills之后,在IE11中,我收到此错误:new Error

错误现在显示worker.ts而不是worker.js

angular internet-explorer-11 web-worker polyfills es5-compatiblity
1个回答
0
投票

enter image description here

© www.soinside.com 2019 - 2024. All rights reserved.