I am using ES2015 Import / Export modules.
In my worker file, when I try to import functions like I normally do:
worker.js
import { a, b, c } from "./abc.js";
I get the error:
SyntaxError: import declarations may only appear at top level of a module
As I am exporting functions in my module 'abc.js', I am not sure how to use them using the old (& apparently on its way out) syntax:
self.importScripts( "/app/abc.js" );
So, my question is, how do we use the new import module syntax with workers?
Second question is, what does importScripts
import into when it imports from a module in where is there is no global object parent being exported?
ES2015 modules in Workers are available in Safari and in Chromium browsers.
If other browsers / versions are your target, you still need to use importScripts()
.
When available, you create a module-worker like this:
new Worker("worker.js", { type: "module" });
See: https://html.spec.whatwg.org/multipage/workers.html#module-worker-example
These are the bug-reports for each browser:
The relevant Can I Use live compatibility data: https://caniuse.com/?search=module%20worker