lang-markdown

@codemirror/lang-markdown is the official Markdown language package for CodeMirror 6. It wires the Lezer Markdown parser into CodeMirror’s language system, giving an editor CommonMark and GitHub Flavored Markdown parsing, syntax highlighting, section folding, and Markdown-aware editing commands.

Beyond parsing, the package layers in editor ergonomics: fenced code blocks can be highlighted with nested language parsers, HTML tags are completed as you type, pasted URLs become links over a selection, and Enter/Backspace continue or unwind list and blockquote markup. It ships as a small, tree-shakeable ES module with TypeScript types.

What You Get

• A markdown() extension factory returning a CodeMirror LanguageSupport value
• commonmarkLanguage and markdownLanguage (GFM plus subscript, superscript, and emoji) as ready-made Language values
• Nested parsing of fenced code blocks via configurable code languages
• Markdown editing commands and a keymap for continuing lists and blockquotes
• HTML-tag autocompletion and a paste-URL-as-link extension

Common Use Cases

• Adding a Markdown editing mode to a CodeMirror-based text or code editor
• Building a documentation or note-taking app with live Markdown syntax highlighting
• Highlighting fenced code blocks inside Markdown using other CodeMirror language packages
• Providing GFM support (tables, task lists, strikethrough) in an embedded editor

Under The Hood

Architecture - The package is a thin, well-factored adapter over the Lezer Markdown parser. markdown.ts configures the base Lezer parser with CodeMirror NodeProps for folding, heading levels, indentation, and language data, then wraps it in a Language via mkLang, exporting commonmarkLanguage and an extended GFM+subscript/superscript/emoji markdownLanguage. index.ts exposes the public markdown() factory that assembles a LanguageSupport, pulling in HTML tag handling, parseCode for nested fenced-code parsing through getCodeParser, an optional keymap, HTML-tag autocompletion, and the pasteURLAsLink DOM handler; commands.ts implements the list/blockquote continuation and deletion commands.

Tech Stack - Written in TypeScript targeting an ES module (type: module, dual import/require exports) with sideEffects: false for tree-shaking. It depends on the CodeMirror 6 core (@codemirror/state, @codemirror/view, @codemirror/language, @codemirror/autocomplete), @codemirror/lang-html for embedded HTML, and @lezer/markdown/@lezer/common for parsing. Build and test tooling comes from @codemirror/buildhelper (cm-buildhelper, cm-runtests).

Code Quality - The code is idiomatic and tightly scoped across four small source files, using triple-slash doc comments on the public API that double as generated README reference docs. A test/test-commands.ts suite exercises the Markdown editing commands. Naming is consistent with the wider CodeMirror ecosystem, types are precise, and edge cases (non-plain-text nodes, tight vs. non-tight lists, code/comment regions) are handled explicitly.

API Design - The developer experience is excellent: a single markdown(config?) call returns a ready extension, and the config object is small but expressive (codeLanguages, defaultCodeLanguage, addKeymap, base, completeHTMLTags, pasteURLAsLink, htmlTagLanguage). Sensible defaults mean zero-config usage works, while advanced needs like nested language highlighting are a one-line addition. The public surface is documented inline and mirrored in the README API reference.