suren-atoyan / monaco-loader

The utility to easy setup monaco-editor into your browser
MIT License
177 stars 37 forks source link

Update monaco-editor version to 0.46.0 #43

Closed voidranjer closed 6 months ago

voidranjer commented 6 months ago

Version 0.46.0 of monaco-editor introduced some breaking changes.

43 46

.

Namely, the EditorOption map has changed (source code here, API reference here), breaking features such as this:

import * as monaco from "monaco-editor";

// Value of `lineHeight` is incorrect: broken due to monaco-editor update
const lineHeight = editorRef.current.getOption(monaco.editor.EditorOption.lineHeight);

/*
* Note:
* `editorRef.current.getOption` refers to the `@monaco-editor/react -> Editor` instance
* `monaco.editor.[...]` refers to the `import *` from `monaco-editor`
* /

API References

Because editorRef.current.getOption() comes from monaco-react (maintained by @suren-atoyan), but monaco.editor.EditorOption.lineHeight comes from monaco-editor (maintained by @microsoft), and the versions are out-of-sync, these changes break user applications that depends on monaco-react.

I have personally ran into such issues, as have others. This is made apparent by issues created on the monaco-react repo such as this one: Bug issue #546.

Some temporary solutions before the PR merge is to modify the Editor component in monaco-react to include these lines in the useMount() hook:

loader.config({ paths: { vs: 'https://cdn.jsdelivr.net/npm/monaco-editor@0.46.0/min/vs' } }); // this is new
const cancelable = loader.init(); // this should already exist

Alternatively, one could also use the monaco instance provided by the monaco-react library by following this guide on the documentation. However, this is not ideal in some cases, because users still have to import from the monaco-editor package for TypeScript type definitions.

NOTE: For TypeScript type definitions, this package uses the monaco-editor package as a peer dependency. So, if you need types and don't already have the monaco-editor package installed, you will need to do so

^ From the documentation

Note: Similar PRs have been merged in the past (see #33), this is just the continuation of such efforts.

suren-atoyan commented 6 months ago

thanks @voidranjer 🙌 I'll let you know once the new version is published