Launching cm6 with css lang support

v6
1

Hi, I’ve currently an issue with cm6 when I’m trying to launch it using the css language support.

My code looks like:

import { EditorState, basicSetup } from '@codemirror/basic-setup';
import { EditorView, keymap } from '@codemirror/view';
import { defaultTabBinding } from '@codemirror/commands';
import { css } from '@codemirror/lang-css';


let editor = new EditorView({
  state: EditorState.create({
    extensions: [basicSetup, css(), keymap.of([defaultTabBinding])]
  }),
  parent: document.body
})

JS and html language supports work fine, with css however the following error is shown:

TypeError: Cannot read property 'extension' of undefined
    at inner (codemirror.js:1662)
    at inner (codemirror.js:1662)
    at inner (codemirror.js:1640)
    at inner (codemirror.js:1662)
    at inner (codemirror.js:1640)
    at inner (codemirror.js:1662)
    at inner (codemirror.js:1640)
    at flatten (codemirror.js:1665)
    at Function.resolve (codemirror.js:1577)
    at Function.create (codemirror.js:2229)

Any suggestions? Thanks in advance.

2

EditorView.lineWrapping is a boolean, not an extension, right? It shouldn’t really be in that array.

3

Thanks for the response. I removed lineWrapping from the array, but the problem still persists.

4

This sounds like your package manager has installed multiple versions of @codemirror/state, which messes up instanceof checks when resolving extensions. Try if deleting your node_modules and package lock and reinstalling helps.