import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { AppComponent } from './app.component';
import { MonacoEditorModule, NgxMonacoEditorConfig } from 'ngx-monaco-editor';
export function onMonacoLoad() {
const monaco = (window as any).monaco;
monaco.languages.typescript.javascriptDefaults.setDiagnosticsOptions({
noSemanticValidation: true,
noSyntaxValidation: false
});
// compiler options
monaco.languages.typescript.javascriptDefaults.setCompilerOptions({
target: monaco.languages.typescript.ScriptTarget.ES2015,
allowNonTsExtensions: true,
allowJS: true,
});
// extra libraries
const libSource = [
'declare class Facts {',
' /*',
' Returns the next fact',
' */',
' static next():string',
' middle():string',
' static prev():string',
'}',
].join('\n');
monaco.languages.typescript.javascriptDefaults.addExtraLib(libSource);
// When resolving definitions and references, the editor will try to use created models.
// Creating a model for the library allows "peek definition/references" commands to work with the library.
monaco.editor.createModel(libSource, 'typescript');
import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { AppComponent } from './app.component'; import { MonacoEditorModule, NgxMonacoEditorConfig } from 'ngx-monaco-editor';
export function onMonacoLoad() { const monaco = (window as any).monaco;
monaco.languages.typescript.javascriptDefaults.setDiagnosticsOptions({ noSemanticValidation: true, noSyntaxValidation: false }); // compiler options monaco.languages.typescript.javascriptDefaults.setCompilerOptions({ target: monaco.languages.typescript.ScriptTarget.ES2015, allowNonTsExtensions: true, allowJS: true, }); // extra libraries const libSource = [ 'declare class Facts {', ' /*', ' Returns the next fact', ' */', ' static next():string', ' middle():string', ' static prev():string', '}', ].join('\n'); monaco.languages.typescript.javascriptDefaults.addExtraLib(libSource); // When resolving definitions and references, the editor will try to use created models. // Creating a model for the library allows "peek definition/references" commands to work with the library. monaco.editor.createModel(libSource, 'typescript');
} const monacoConfig: NgxMonacoEditorConfig = { baseUrl: 'assets', defaultOptions: { scrollBeyondLastLine: false }, onMonacoLoad }; @NgModule({ declarations: [ AppComponent ], imports: [ BrowserModule, FormsModule, MonacoEditorModule.forRoot(monacoConfig) // use forRoot() in main app module only. ], providers: [], bootstrap: [AppComponent] })
in editor, intellisense will work(Facts.next()) but soon be invalidated why?