我正在使用 ES2015 导入/导出module。
在我的工作文件中，当我尝试像往常一样导入函数时：
工人.js
import { a, b, c } from "./abc.js";
我收到错误：
SyntaxError: import declarations may only appear at top level of a module
当我在我的module 'abc.js' 中导出函数时，我不确定如何使用旧的（并且显然正在淘汰）语法来使用它们：
self.importScripts( "/app/abc.js" );
所以，我的问题是，我们如何对工作人员使用新的导入module语法？
第二个问题是，importScripts当它从没有导出全局对象父级的module中导入时，import into 是什么？
Workers 中的 ES2015 module在Safari 和 Chromium 浏览器中可用。
如果其他浏览器/版本是您的目标，您仍然需要使用importScripts().
如果可用，您可以像这样创建一个module工作者：
new Worker("worker.js", { type: "module" });
请参阅：https : //html.spec.whatwg.org/#module-worker-example
这些是每个浏览器的错误报告：
Chrome 80 已于 2020 年 2 月推出了module工作器（Chrome 82 将为共享工作器提供module）。Firefox/Safari 目前不支持这些功能：测试
您可能想使用import-from-worker lib 为您完成繁重的工作（目前，您需要检查对工作程序中module的支持并自己进行回退）。
工人中的 ES module已经在 Chrome 中可用，启用实验性 Web 平台功能，在启动 chrome 时使用适当的标志：
chrome.exe --enable-experimental-web-platform-features
这是将工作脚本作为module加载所需的语法：
new Worker( 'my-worker.js', { type : 'module' } );
这个功能已经开发了将近一年，应该很快就会可用，不需要特殊的标志，但是，还没有正式的发布日期。
截至 11 月 21 日，在工作人员中导入module似乎仍然不稳定。一种解决方案是使用汇总从您的工作人员生成 IIFE，如下所示：
//worker.js
import { MyModule } from 'my-module.js'
onconnect = async (e) => {
var port = e.ports[0];
MyModule.func()
port.onmessage = (e) => {
port.postMessage("Hi App");
}
}
//rollup config
export default [
{
'input': 'worker.js',
'output': {
'file': 'dist/worker.js',
'format': 'iife'
},
},
]
//dist/worker.js (rollup output)
(function () {
'use strict';
//MyModule code here, generated by rollup
MyModule.func()
onconnect = async (e) => {
var port = e.ports[0];
port.onmessage = (e) => {
port.postMessage("Hi App");
};
};
}());
//main app
const worker = new SharedWorker("/dist/worker.js");
worker.port.onmessage = (e) => {
console.log('Message received from worker: ' + e.data);
}
worker.port.postMessage("Hi worker");
本质上 rolllup 正在做浏览器应该做的工作。这对我来说效果很好。当然，代码大小会增加，因为module代码也被复制到工作线程中。但它仍然是 DRY 的，因为代码是由 rollup 生成的。
对我来说，self.工作得很好。我已经把导入到另一个 js 文件：abcImported.js
import { a, b, c } from "./abc.js";
export { a, b, c };
在服务工作者中：
self.a = require('abcImported.js').a;
self.b = require('abcImported.js').b;
通过这种方式，它可以在工作人员内部访问。（在铬测试）