Support loading ESM workers natively as module Workers

[dmnsgn]

Bug/Feature request

I aware that this package currently doesn't support a fully native ESM module because it contains .css/.ttf imports.

The css imports might eventually be okay with CSS module scripts:

import sheet from './styles.css' assert { type: 'css' };

There will still be an issue with how the workers are loaded. Since the monaco-editor/esm/vs/language/typescript/ts.worker.js and monaco-editor/esm/vs/editor/editor.worker.js are ESM modules (they contain imports), they will need to be imported as module Workers:

const editorWorker = new Worker(new URL('monaco-editor/esm/vs/editor/editor.worker.js', import.meta.url), {
  type: 'module'
});

The editor Worker imports monaco-editor/esm/vs/editor/common/services/editorSimpleWorker.js which contains a typeof importScripts check but "the old importScripts() method is not available within module workers"; it will throw:

Uncaught TypeError: Failed to execute 'importScripts' on 'WorkerGlobalScope': Module scripts don't support importScripts().

(as discovered trying to load workers directly with webpack target esm).

So the worker should use import instead of importScripts or be self-contained classic workers.

Related issues:

ESM with Vanilla JS: https://github.com/microsoft/monaco-editor/issues/2335

ES Modules (vs Webpack): https://github.com/microsoft/monaco-editor/issues/949

ESM and CSS loading: https://github.com/microsoft/monaco-editor/issues/886

[dmnsgn]

Alternatively (and probably best until "module Worker" support is better), the workers should be standalone bundled eg. not contain ESM import/export. @alexdima is that something the new ESBuild usage could help with?

[songzhonghuasongzhonghua]

same question