CODEWITHSUNDEEP
monaco-editorvisual-studio-monaco
user3006967
user3006967

Reputation: 3545

monaco editor theme can not be changed dynamically

I want to update monaco editor theme on the fly, but I found it does not work:

this.editorOptions = {
                ...this.editorOptions,
                readOnly: true, // this.readOnly,
                value: this.code,
                language: 'java',
                theme: 'vs'
            };
            this.currentEditor.updateOptions(this.editorOptions);

If I change the readOnly, it worked fine, but theme is NOT updated at all.

the create logic is like this:

this.editorOptions = {
                ...this.editorOptions,
                readOnly: this.readOnly,
                value: this.code,
                language: this.updatedType.toLowerCase(),
                //theme: 'vs-dark'
                theme: t === 'light' ? 'dv-light-theme' : 'dv-dark-theme'
            };
            this.currentEditor = monaco.editor.create(this._editorContainer.nativeElement, this.editorOptions);

Please help and show how you can update the theme on the fly dynamically.

Upvotes: 1

Views: 1598

Answers (1)

Korpen
Korpen

Reputation: 68

I just learned from https://blog.expo.dev/building-a-code-editor-with-monaco-f84b3a06deaf that to set the theme you call monaco.editor.setTheme('<theme-name>'). I was incorrectly calling setTheme on my editor instance.

Upvotes: 2

Related Questions