<> < ({name: mod.name, link: "#" + mod.name}))>>

Reference Manual

For the time being, CodeMirror 6 is published as a single package, @codemirror/next, of which the modules listed here are subdirectories. So to, for example, load the text module, you'd import or require "@codemirror/next/text".

(In the future, these will be published as separate npm packages.)

Each package exposes an ECMAScript module. You'll have to use some kind of bundler to run them in the browser.

The most interesting modules are state, which contains the data structures that model the editor state, and view, which provides the UI component for an editor.

A minimal editor might look like this:

import {EditorView} from "@codemirror/next/view"
import {EditorState} from "@codemirror/next/state"

let myView = new EditorView({state: EditorState.create({doc: "hello"})})
document.body.appendChild(myView.dom)

But such an editor is too primitive for real use. To get functionality like key bindings, highlighting, a line number gutter, or an undo history, you need to add various extensions to such a basic editor.

<>

<> module

<>
<
>
<>