atularen / ngx-monaco-editor

Monaco Editor component for Angular 2 and Above
https://www.npmjs.com/package/ngx-monaco-editor
MIT License
428 stars 155 forks source link

ngx-monaco-editor 9.0.0 not working for custome theme in angular 10 #263

Open shruti-devurkar opened 1 year ago

shruti-devurkar commented 1 year ago

I am trying applu custom theme to ngx-monaco-editor but cannot see thenew styles being applied , the only thing I am confuse is the baseUrl, what it should point to?

here is my code: monaco.ts

import { NgxMonacoEditorConfig } from 'ngx-monaco-editor'; export const monacoConfig: NgxMonacoEditorConfig = { onMonacoLoad: function() { monaco.editor.defineTheme('myCustomTheme', { base: 'vs-dark', inherit: true, rules: [], colors: { "editor.background": "#ffa500", } }); monaco.editor.setTheme('myCustomTheme'); } };

objective.module.ts: import { monacoConfig } from './monaco'; import { FormsModule } from '@angular/forms';

@NgModule({ imports: [ CommonModule, RouterModule, HttpClientModule, SharedModule, MonacoEditorModule.forRoot() ], providers: [{ provide: NGX_MONACO_EDITOR_CONFIG, useValue: monacoConfig}]

angular.json has glob:

{ "glob": "*/", "input": "node_modules/ngx-monaco-editor/assets/monaco", "output": "./assets/monaco/" },

<ngx-monaco-editor name="tab.title {{ i }}" [options]="tab.editorOptions"
[(ngModel)]="editorTabs[i].content">

export class TextEditorComponent implements OnInit, AfterViewInit, OnChanges { @Output() onCloseSubFileTab = new EventEmitter(); @Input('cases') cases = []; editorOptions = { theme: 'myCustomTheme', language: '', minimap: { enabled: false }, automaticLayout: true }; ...