如何让Web工作人员使用TypeScript和webpack

发布时间：2020-12-14 18:53:30 所属栏目：资源来源：网络整理

导读：当我尝试使用网络工作者时,我正在编译我的打字稿有一些问题. 我有一个像这样定义的工人： onmessage = (event:MessageEvent) = { var files:FileList = event.data; for (var i = 0; i files.length; i++) { postMessage(files[i]); }}; 在我的应用程序的另

当我尝试使用网络工作者时,我正在编译我的打字稿有一些问题.

我有一个像这样定义的工人：

onmessage = (event:MessageEvent) => {
  var files:FileList = event.data;
    for (var i = 0; i < files.length; i++) {
        postMessage(files[i]);
    }
};

在我的应用程序的另一部分,我正在使用webpack worker loader来加载我的工作,如下所示：let Worker = require(‘worker！../../../ workers / uploader / main’);

但是,当应用程序必须被剔除时,我有一些问题,使得打字机声明不会对我大叫.
根据我的研究,我必须添加另一个标准的lib到我的tsconfig文件来公开工作人员需要访问的全局变量.我这样指定：

{
     "compilerOptions": {
          "lib": [
               "webworker","es6","dom"
          ]
     }
}

现在,当我运行webpack让它构建一切,我得到一堆错误,如下所示：C：/Users/hanse/Documents/Frontend/node_modules/typescript/lib/lib.webworker.d.ts：1195：13
后续变量声明必须具有相同的类型.变量“导航器”必须是“导航器”类型,但是这里有“WorkerNavigator”类型.

所以我的问题是：我如何指定,所以Webworker使用lib.webworker.d.ts定义,一切遵循正常的定义？

解决方法

在你的tsconfig.json文件中,在compilerOptions中设置这个：

{
    "compilerOptions": {
        "target": "es5",//this config for target "es5"
        "lib": ["webworker","es5","scripthost"]
        //uncomment this for target "es6"
        //"lib": ["webworker","scripthost"]
    }
}

Web工作人员无法访问DOM,窗口,文档和父对象(完整列表支持的对象在这里：Functions and classes available to Web Workers); TypeScript的dom lib不兼容,并重新定义了在lib.webworker.d.ts中定义的一些元素

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!