Sample from "Getting started guide" doesn't work

[AresEkb]

I'm trying to follow Getting started guide

Here is a sample project: https://github.com/AresEkb/monaco-editor-lsp-test

It throws the following error: "Duplicate extension point: authentication"

Could you please help to fix it?

[AresEkb]

I think I've got it. The problem caused by version conflict. The current monaco-languageclient depends on @codingame/monaco-vscode-api 15.0.3. But the latest version is 16.0.3. I've fixed dependencies and now it works much better.

I've got two versions now:

1. Plain ( http://localhost:5173/plain.html )

LSP works fine. But code highlighting doesn't work. There is the following message in the console:

INFO getWorker: moduleId: workerMain.js label: TextEditorWorker

2. React ( http://localhost:5173/ )

Code highlighting works. But LSP doesn't work. The messages in the console:

INFO getWorker: moduleId: workerMain.js label: editorWorkerService
PythonEditor.tsx:49 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
PythonEditor.tsx:49 Unimplemented worker editorWorkerService (workerMain.js)

The code is almost identical in both cases. Why LSP doesn't work in the 2nd example? Why worker is not created correctly?

Probably I could use monaco-editor-wrapper or monaco-editor-react. But they doesn't work in my examples either and it's much harder to figure out why because there are a lot of magic behind them

[kaisalmen]

Probably I could use monaco-editor-wrapper or monaco-editor-react. But they doesn't work in my examples either and it's much harder to figure out why because there are a lot of magic behind them

Hi @AresEkb the configuration is fully typed and there are many examples in the repo. Maybe there needs to be more text explaining what is possible.

[AresEkb]

The most complicated thing for me is that I'm new to all these stuff. There are a lot of plugins, different versions of plugins, a lot of examples, a lot of functions used in examples. For instance, this example calls vscode.commands.executeCommand('workbench.view.explorer'). I don't understand whether this command shows a file explorer or not. At first I didn't get how to call runPythonReact() function and how to embed MonacoEditorReactComp into my application. Config imports a lot of extension. All of the examples are located in a single project, and at first it's not easy to figure out where one example ends and another one starts. I simply overwhelmed by information. It's great if you are already into the topic.

But for newbies, I think such a tutorial is better, because it starts from simple things and proceeds to more complicated things. For example at first we use plain Monaco editor without any extra extensions and there is a simple Git repository that can be cloned or simple instructions how to create such a project. Then we do the same thing using monaco-editor-wrapper. And then the same thing using monaco-editor-react

[kaisalmen]

@AresEkb so something like a project generator could be useful, e.g. npm create monaco-editor-wrapper and you get a hello world project with vite and TypeScript config and a simple config.

Right now, the easiest way to get started with monaco-languageclient (from my point of view ) is to clone it, read the complete README. build it, launch the vite dev server and use the index.html to go through all examples. Everything that needs to be launched in addition is explained. There are already fairly simple and very complex examples. But I agree the very simple hello world example is missing.

Creating and maintaining all takes time. Let's see when we end up and where. Help is always appreciated. 🙂