both ngx-monaco-editor and monaco-editor define MonacoEnvironment

[thomasvt]

Hello,

In old major versions, a global variable "MonacoEnvironment" was defined by the monaco-editor package only. But since a few major versions, @materia-ui/ngx-monaco-editor also defines it, causing compile errors when your code imports both:

eg. I need MarkerSeverity and Range from the monaco-editor package because I do things that seem not to be possible through the @materia-ui package. (create squible errors, insert code-snippets)

To get the error, simply create the minimal example like on your github .md and then import something from _monacoeditor:

import { MarkerSeverity, Range } from 'monaco-editor';

Error TS2451: Cannot redeclare block-scoped variable 'MonacoEnvironment'.

• definition 1: node_modules/monaco-editor/esm/vs/editor/editor.api.d.ts:12:9
• definition 2: node_modules/@materia-ui/ngx-monaco-editor/lib/interfaces/monaco.d.ts:6:13

When I manually remove the declaration in node_modules/@materia-ui/... everything works, but of course i cannot do this on our automated build agents.

Is there some way to fix this, please?

[kprasad99]

I'm also getting same error

[nikhilnxvverma1]

Also getting the same error

[rbelando]

Same here :D

[ivan-kzn]

Have anyone found workaround for this?

[thomasvt]

Hi, it's been a while but I remember coming to the conclusion that this repo is dead and we had to fix our problem.

So, I just copied the code of the materia package to my app (as if we wrote it ourselves) and fixed the issue as I explained in my OP.

You could also try using only the original one https://microsoft.github.io/monaco-editor/ I don't remember what the difference is or why we ended up using the Materia fork, but I guess we had our reasons.

[ivan-kzn]

thanks @thomasvt