CodeMirror does not display colors, code, or mode

[andrewryan1906]

I've tried following the instructions and piecing together stuff on the forums and can't seem to get this to work. I'm running Angular 7.

My angular.json:

          "styles": [
      ..
              "node_modules/codemirror/lib/codemirror.css",
              "node_modules/codemirror/theme/darcula.css"
            ],
            "scripts": [
              "node_modules/codemirror/lib/codemirror.js",
            ]

My feature module:

@NgModule({
 imports: [
..
    CodemirrorModule,
  
  ],
  providers: [..],
  exports: []
})

My component HTML:

<codemirror formControlName="template" [config]="batchTemplateCodeMirrorConfig" style="width: 100%" [ngClass]="form.get('template').errors && form.get('template').touched ? 'is-invalid' : ''"> </codemirror>

My component ts:

import 'codemirror/mode/javascript/javascript';


@Component({
..
})
export class CodeMirrorDemo implements OnInit, OnDestroy {

 ..
  batchTemplateCodeMirrorConfig = {
    value: 'let x=x+1',
    theme: 'darcula.css',
    lineNumbers: true,
    mode: 'javascript' };

..

The line numbers display, but no theming comes through and the javascript mode isn't respected.

What am I missing? FWIW I tried including the javascript mode js in the angular.json, but I got a loading error in the Chrome console:

CodeMirror.defineMode is not a function

.. and it didn't work.

[andrewryan1906]

Pinging again... dead in the water, I think I'm doing something silly but would like some help.

Thanks!
Andrew

[Amin020]

#37

Solved here