Add a remix project

[kjellaso]

Hi! Anyone tried using the editor in a remix project? Is the best solution to setup this project as a standalone application, and then bring it in to my remix app with an iframe, or is it possible to integrate it with my remix app?

[msujew]

@kjellaso As far as I understand remix, it seems to be rendering just normal HTML. Did I get that right?

You should be able to just use a similar mechanism as the browser example. Just create a simple div with an id:

monaco-languageclient/packages/examples/browser.html

Line 13 in 789f8e5

<div id="container" style="width:800px;height:600px;border:1px solid grey"></div>

And use that element as a container for the monaco editor:

monaco-languageclient/packages/examples/src/browser/main.ts

Line 29 in 789f8e5

htmlElement: document.getElementById('container')!,

[msujew]

It should be enough to just consume this package from npm. Have you encountered any issues with that approach?

[kjellaso]

No, seems I'm just jumping to conclusions. Just confused by the documentation that tells me to do "npm run build" before the example is presented . But I'll try to install the packages referenced in the example before wasting your time again 😊

[kaisalmen]

@kjellaso the examples in this project can rely on the local build if you check out the project (this is an npm workspace). Therefore it makes sense to build or watch the code before you run the examples if you changed code locally. The tagged commit are available on npm, e.g.: https://github.com/TypeFox/monaco-languageclient/tree/mlc-7.2.0

If you work in an independent project, just use the npm package.

[kaisalmen]

We have not deployed the examples somewhere (some rely on external server processes = node based language servers), but we could think about deploying the ones suitable to GitHub pages in the future. Then you could look at them without cloning the repo.

[kjellaso]

Thank you!