Open shruti-devurkar opened 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 }; ...
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 }; ...