CM6 linting and error notifications/highlighting

v6
1

Hi there,

new to CM, and currently working on a react build. I am trying to have CM6 highlight errors found while linting as in this CM5 example: CodeMirror: Linter Demo

I really like the modular design of CM6 and I know it’s a work in progress. I think it’s because of this and how relatively new it is that I’m unable to figure out how to do this. I’ve been looking through examples here: CodeMirror Examples and have not seen a linting one yet.

Any help would be greatly appreciated. Thanks!

2

Update:
I’ve found this example ( codesandbox-next-363 (forked) - CodeSandbox ) which has gotten basic linting setup. I’m still looking to setup line markers for errors and warnings, as well as having a more general understanding of what’s going on and how to set this up for other languages like JSON

3

Any JSON linters that are compatible with the current plugin setup?

4

And lastly, how could I openLintPanel ? I found the function under the view but it is not working when i call it with a reference to my editorView

1 Like
5

You should be able to use the one included in the language package: codemirror/lang-json.

import { linter } from '@codemirror/lint'
import { json, jsonParseLinter } '@codemirror/lang-json'

const linterExtension = linter(jsonParseLinter())

const editor = new EditorView({
  state: EditorState.create({
    extensions: [json(), linterExtension]
  }),
  parent: document.body
})
6

That should work. Any errors in the console?