I wrote I quick demo on how you can display errors in the editor, however to get useful error messages you’d want to use an external linter as noted in this thread.
import { linter, Diagnostic } from "@codemirror/lint";
function lintExample(view: EditorView): readonly Diagnostic[] {
const diagnostics: Diagnostic[] = [];
syntaxTree(view.state).iterate({
enter: (type, from, to) => {
if (type.isError) {
diagnostics.push({
from,
to,
severity: "error",
message: "Yep. That's a syntax error.",
});
}
},
});
return diagnostics;
}
// Run the example as an extension like this.
linter(lintExample)