CodeMirror 6 LaTeX Extension

Interactive Demo

Try out the LaTeX language support for CodeMirror 6 below.

Auto-close tags Enable linting Enable tooltips Auto-close brackets

Features

LaTeX syntax highlighting
Auto-indentation for environments and groups
Code folding for environments and document sections
Bracket matching
Autocompletion for common LaTeX commands and environments
Snippets for common LaTeX structures
Auto-closing of environments
Hover tooltips with command and environment documentation
LaTeX-specific linting

Installation

npm install codemirror-lang-latex

Usage

import { EditorState, EditorView } from '@codemirror/basic-setup';
import { latex } from 'codemirror-lang-latex';

let editor = new EditorView({
  state: EditorState.create({
    doc: '\\documentclass{article}\n\\begin{document}\nHello, world!\n\\end{document}',
    extensions: [
      // ... other extensions
      latex()
    ]
  }),
  parent: document.querySelector('#editor')
});