monaco-editor integration with angular6 app

Question

I'm trying to integrate Monaco Editor into my angular lib in an Angular-6 app, I'm new at this and the official docs doesn't have any setup guide for the implementation. Any advice or guidance would be greatly appreciated.

Answer 1

Use the ngx-monaco-editor NPM module

It provides support for various angular versions

In your case for Angular 6 you need to do

npm install ngx-monaco-editor@6.0.0 --save

then reference the module in your app.module

import { MonacoEditorModule } from 'ngx-monaco-editor';
...
imports: [
...
MonacoEditorModule.forRoot(),
...

and then in your html component you can use it like such:

<ngx-monaco-editor ... ></ngx-monaco-editor>

Read the readme here: https://www.npmjs.com/package/ngx-monaco-editor