我正在使用 ES2015 的导入/导出模块。
在我的 worker 文件中，当我尝试像平常一样导入函数时：
worker.js
import { a, b, c } from "./abc.js";
我遇到了错误：SyntaxError: import declarations may only appear at top level of a module
由于我在模块'abc.js'中导出函数，我不确定如何使用旧的（似乎已经过时）语法来使用它们：
self.importScripts( "/app/abc.js" );
我的问题是，我们如何在工作线程中使用新的导入模块语法？
第二个问题是，当从没有导出全局对象父级的模块中导入时，importScripts 导入到哪里？
ES2015模块在Workers中在Safari和Chromium浏览器中可用。
如果其他浏览器/版本是您的目标，您仍然需要使用importScripts()。
当可用时，您可以像这样创建一个模块化的worker：
new Worker("worker.js", { type: "module" });
Chrome 80在2020年2月已经推出了模块化工作线程（而Chrome 82将为共享工作线程提供模块）。目前Firefox/Safari不支持这些功能：测试结果
你可能想要使用import-from-worker库来帮你完成繁重的部分（目前，你需要检查工作线程中模块的支持情况，并自己进行后备处理）。
Chrome已经支持在Web Worker中使用ES模块，启用实验性的Web平台功能只需要在启动Chrome时使用正确的标志即可：
chrome.exe --enable-experimental-web-platform-features
以下是您需要使用的语法将工作线程脚本加载为模块：
new Worker( 'my-worker.js', { type : 'module' } );
这一功能已经开发了近一年，将很快面世，无需特殊标志，但目前还没有官方发布日期。
chrome://flags/ 中搜索 实验性 Web 平台功能 或类似内容。 - Fox//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");
实际上，Rollup正在执行浏览器应该执行的工作。
这对我来说很有效。当然，模块代码也会被复制到worker中，因此代码大小会增加。但仍然保持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;
这样，它就可以在 worker 内部访问。（在 Chrome 中测试过）
require 的？ - Jefferey CaveabcImported.js 是一个单独托管的文件吗？ - arctic_hen7
SharedWorker的82版本怎么回事？好吧，他们决定跳过这个版本了，而83的稳定版计划于2020年5月19日发布。 - Константин Ванimportexport其他模块，否则可以使用importScripts进行相同操作。因此，单个 Web Worker 可以成为一个多模块模块，对吧？ - sçuçu