tsWorker module build error, or can't create web workers (+ undefined warnings)

[jhk-mjolner]

Hi,

I've updated monaco-languageclient from a previous setup, and that seems to have broken the LSP over websocket in such a way that initialization seemed to work, but the "textDocument/didOpen" message and other messages that should be sent while interacting with the document was never sent.
I couldn't figure out what was missing, so I've tried using and adapting to the monaco-editor-wrapper. But if I copy-paste the configureMonacoWorkers method from https://github.com/TypeFox/monaco-languageclient/blob/main/packages/examples/src/common/client/utils.ts and use it like in https://github.com/TypeFox/monaco-languageclient/blob/main/packages/examples/src/ts/wrapperTs.ts, I get the following compile error:

./node_modules/monaco-editor-wrapper/dist/workers/tsWorker-es.js - Error: Module build failed (from ./node_modules/@angular-devkit/build-angular/src/tools/babel/webpack-loader.js):
SyntaxError: <PROJECT_FOLDER>\node_modules\monaco-editor-wrapper\dist\workers\tsWorker-es.js: Unexpected token, expected "," (101756:16)

  101754 |       if (Y.inlineSourceMap) {
  101755 |         const be = oe.toString();
> 101756 |         return `data:application/json;base64,${Yie(bu, be)}`;
         |                 ^
  101757 |       }
  101758 |       const ae = oc(Ou(N.checkDefined(Ce)));
  101759 |       if (Y.mapRoot) {

Which doesn't make sense to me, as it looks like valid javascript to me and my IDE.

If I instead create my own worker factory function that only matches and creates the two workers in configureMonacoWorkers, and doesn't use useWorkerFactory from 'monaco-editor-wrapper/workerFactory' and thereby avoids referencing monaco-editor-wrapper\dist\workers\tsWorker-es.js, it compiles.
It seems to also work at runtime, but I get some weird runtime warnings that has me concerned something is broken.
I get Could not create web worker(s). Falling back to loading web worker code in main thread, which might cause UI freezes. Please see https://github.com/microsoft/monaco-editor#faq but the faq only states I can't load web workers when using file://, which I'm not.
I also get two warnings that just outputs undefined, one seemingly coming from the call to .initAndStart on the wrapper, and the other coming from an import of PushPipe, which doesn't make sense to me.
I also need to import '@codingame/monaco-vscode-json-default-extension' for the LSP communication to work, and I don't know why, except that the file atm is declared to be json. My goal is to support another custom extension and language with a custom LSP server.

I'd like to have the web workers load correctly, avoid weird nonsensical undefined warnings, and avoid making my own worker factory, if possible.
Do you have any suggestions or ideas on how I could proceed?

Both issues feel like it could be an issue with webpack, but I've had no luck trying to make it closer to https://github.com/TypeFox/monaco-languageclient/blob/main/verify/webpack/webpack.config.js
Messing around with tsconfig.json also did not seem to help.

My code using the monaco editor: https://github.com/Open-Pectus/Open-Pectus/blob/jhk/use-monaco-wrapper/openpectus/frontend/src/app/details/method-editor/monaco-editor.component.ts
webpack config, tsconfigs, package.json and angular.json are in: https://github.com/Open-Pectus/Open-Pectus/tree/jhk/use-monaco-wrapper/openpectus/frontend

Slightly related question as it might circumvent the issue if it is a webpack problem:

I've tried migrating from webpack to esbuild before, but was hindered because it was impossible to configure it correctly as angular isn't using vite (except as dev server) and all the documentation/plugins were for either webpack or vite.
I can see in https://github.com/TypeFox/monaco-languageclient/blob/main/verify/angular/angular.json that you at least have a simple build using esbuild in angular. Would you expect I should be able to migrate my angular to using esbuild now? Is it supported?

Sorry it's a jumble of several problems and questions, but I'm not having a good time keeping track of it all myself.

[kaisalmen]

Hi @jhk-mjolner angular build problems are an unresolved issue right now (there are two open issues right now). Webpack dev server was no longer working and the esbuild approach is also not working in dev mode because the esbuild plugin we use with vite does not work there.

Once CodinGame/monaco-vscode-api#555 is done and the new packages are available my plan is to re-asses the current status and then I will try to fix the Angular issues.