@codemirror/language

Syntax Highlighting

This feature allows for syntax highlighting of JavaScript code within the CodeMirror editor. By importing the JavaScript language support from the package and applying it as an extension to the editor, the code within the editor is automatically highlighted according to the syntax of JavaScript.

import {javascript} from '@codemirror/lang-javascript';

let myEditor = new EditorView({
  doc: 'function myScript(){\n  console.log(\"Hello, world!\");\n}',
  extensions: [javascript()]
});

Code Parsing for Autocompletion

This code sample demonstrates how to enable autocompletion for JavaScript code. By combining the JavaScript language support with the autocomplete extension from CodeMirror, the editor can suggest completions based on the current context in the code, enhancing the coding experience.

import {javascript} from '@codemirror/lang-javascript';
import {autocomplete, startCompletion} from '@codemirror/autocomplete';

let myEditor = new EditorView({
  doc: 'console.',
  extensions: [javascript(), autocomplete(), EditorView.updateListener.of(update => {
    if (update.changes) startCompletion(myEditor);
  })]
});