小编Mat*_*t D的帖子

在 Typescript 中使用 WebWorkers 和 Webpack 以及没有自定义加载器字符串的 worker-loader

我正在尝试让网络工作者使用 Typescript 和 Webpack 的worker-loader。他们的文档中有一个通过自定义模块声明实现这一点的示例,但这依赖于使用 webpackworker-loader!./myWorker语法。

我希望能够通过自定义*.worker.jswebpackuse规则加载工作人员,而不是在导入字符串中明确列出加载程序。如果是简单的相对导入,打字稿似乎不喜欢定义或修改模块声明,并且卡住了工作文件不是模块的事实,即使有模块声明也是如此。

我有一个看起来像的工人

// test.worker.ts
/// <reference lib="webworker" />

const worker: DedicatedWorkerGlobalScope = self as any;

worker.onmessage = ({ data }) => {
  if (data instanceof Array) {
    worker.postMessage(data.join(' ') + '!');
  }
};

Run Code Online (Sandbox Code Playgroud)

一个看起来像的声明

// custom.d.ts
declare module '*.worker' {
  class TestWorker extends Worker {
    constructor();
  }

  export default TestWorker
}
Run Code Online (Sandbox Code Playgroud)

并在我的主应用程序中用作

import TestWorker from './test.worker';

const testWorker = new TestWorker();
testWorker.onmessage = ({ data }: …
Run Code Online (Sandbox Code Playgroud)

web-worker typescript webpack

7
推荐指数
1
解决办法
2755
查看次数

标签 统计

typescript ×1

web-worker ×1

webpack ×1