CodeMirror

The codemirror package is the convenient entry point to the CodeMirror 6 code editor. Rather than installing and wiring up the many small @codemirror/* modules by hand, it re-exports EditorView alongside two ready-made extension bundles, basicSetup and minimalSetup, that pull together the features most editors need.

Use it to spin up a fully functional in-browser code editor in a handful of lines, then graduate to composing the underlying modular packages directly once you need finer control over the configuration.

What You Get

• A basicSetup extension bundling line numbers, undo history, code folding, bracket matching, autocompletion, search, and linting keymaps
• A minimalSetup extension for a lean editor with just history, selection drawing, and default highlighting
• A re-exported EditorView so you can construct an editor from a single import
• First-class TypeScript types and dual ESM/CJS builds
• A documented, copy-pasteable source you can fork when you outgrow the defaults

Common Use Cases

• Embedding a code editor in a web app, playground, or documentation site
• Prototyping a CodeMirror configuration before hand-tuning the underlying modules
• Teaching or demoing CodeMirror 6 with a minimal boilerplate footprint

Under The Hood

Architecture

The entire package is a single module, src/codemirror.ts (~97 lines), that acts as a composition layer over the modular @codemirror/* v6 ecosystem. It imports feature extensions from @codemirror/view, @codemirror/state, @codemirror/language, @codemirror/commands, @codemirror/search, @codemirror/autocomplete, and @codemirror/lint, then flattens them into two exported Extension array literals: basicSetup (the full-featured default, including a merged keymap of closeBrackets, default, search, history, fold, completion, and lint bindings) and minimalSetup (a lean subset). It also re-exports EditorView so consumers can construct an editor from one import. Extensions are wrapped in immediately-invoked functions to work around tree-shaking limitations.

Tech Stack

Written in TypeScript and built with @codemirror/buildhelper (cm-buildhelper) into dual ESM (dist/index.js) and CommonJS (dist/index.cjs) outputs with bundled type declarations. It declares seven @codemirror/* ^6.0.0 runtime dependencies and is marked sideEffects:false for optimal bundling. There is no framework binding; it is view-layer agnostic and works anywhere the DOM is available.

Code Quality

The source is deliberately minimal, readable, and heavily annotated with /// doc comments that enumerate exactly which extensions each bundle includes. The repository ships no local test files (the test script defers to the shared cm-runtests harness), which is reasonable given the package is a thin, declarative aggregation with no branching logic. Types come directly from the underlying packages, so the public surface is fully typed.

API Design Developer experience is the package’s whole reason for existing, and it excels: a working editor is new EditorView({parent, doc, extensions: [basicSetup]}). Naming is clear (basicSetup vs minimalSetup), the two exports cover the common cases, and the documentation explicitly guides users to copy the source into their own project once they need custom configuration, an honest and well-considered escape hatch.