如何在Svelte中结合Esbuild使用Web Worker？报错求助

问题场景 #

按教程在Svelte项目中用Esbuild配置Web Worker时，出现Uncaught TypeError: Worker is not a function错误。

相关代码 #

Svelte组件代码 #

import Worker from 'src/timerWorker'
const worker = Worker();
worker.postMessage(['hello world']);

timerWorker.ts 代码 #

self.onmessage = function(e) {
    console.log(e);
}

Esbuild 插件配置 #

plugins: [
  esbuildSvelte({
    compilerOptions:{ css: true },
    preprocess: sveltePreprocess(),
  }),
  inlineWorkerPlugin(),
],

错误截图 #

解决步骤 #

1. 修正Worker实例化方式
   导入的Worker是构造函数，必须用new关键字实例化，而非直接调用：

   import TimerWorker from 'src/timerWorker';
   const worker = new TimerWorker();
   worker.postMessage(['hello world']);
   

2. 确认inlineWorkerPlugin配置有效性
   检查inlineWorkerPlugin是否正确处理.ts后缀的Worker文件，确保插件版本适配当前Esbuild版本，若插件未正确导出Worker构造函数，需核对插件文档调整配置。

3. 优化Worker文件语法（可选）
   改用标准ES模块事件监听写法，提升兼容性：

   addEventListener('message', (e) => {
     console.log(e.data);
   });
   

4. 指定Esbuild目标环境
   在Esbuild配置中添加目标环境，确保Web Worker特性被正确编译：

   target: ['es2020', 'chrome90', 'firefox90'],
   

内容的提问来源于stack exchange，提问作者Borouch