CodeMirror 6 editor for Angular

Installation

Use the CodeFirst NPM registry for @sandkasten packages in your ~/.npmrc file:

@sandkasten:registry=https://codefirst.iut.uca.fr/git/api/packages/sandkasten/npm/

npm install @sandkasten/codemirror6-editor codemirror @codemirror/state @codemirror/view

Install the language support you need, for example with JavaScript:

npm install @codemirror/lang-javascript

Import the component in either the app.module.ts file or the component:

import { CodeMirrorComponent } from 'codemirror6';

A code editor with JavaScript syntax highlighting:

<codemirror6-editor
  [(ngModel)]="editorContent"
  [extensions]="[
    basicSetup,
    javascript()
  ]"
></codemirror6-editor>

A read-only code output:

<codemirror6-editor
  [(ngModel)]="editorContent"
  [extensions]="[
    EditorState.readOnly.of(true)
  ]"
></codemirror6-editor>