[ WEBSITE | ISSUES | FORUM | CHANGELOG ]
This package implements HTML language support for the CodeMirror code editor.
The project page has more information, a number of examples and the documentation.
This code is released under an MIT license.
We aim to be an inclusive, welcoming community. To make that explicit, we have a code of conduct that applies to communication around the project.
import {EditorView, basicSetup} from "codemirror"
import {html} from "@codemirror/lang-html"
const view = new EditorView({
parent: document.body,
doc: `<!doctype html>\n<title>HTML</title>`,
extensions: [basicSetup, html()]
})-
html(config?: Object = {}) → LanguageSupport Language support for HTML, including
htmlCompletionand JavaScript and CSS support extensions.-
config By default, the syntax tree will highlight mismatched closing tags. Set this to
falseto turn that off (for example when you expect to only be parsing a fragment of HTML text, not a full document).By default, the parser does not allow arbitrary self-closing tags. Set this to
trueto turn on support for/>self-closing tag syntax.Determines whether
autoCloseTagsis included in the support extensions. Defaults to true.Add additional tags that can be completed.
-
extraGlobalAttributes?: Record<string, readonly string[] | null> Add additional completable attributes to all tags.
-
nestedLanguages?: {tag: string, attrs?: fn(attrs: Object<string>) → boolean, parser: Parser}[] Register additional languages to parse the content of specific tags. If given,
attrsshould be a function that, given an object representing the tag's attributes, returnstrueif this language applies.-
nestedAttributes?: {name: string, tagName?: string, parser: Parser}[] Register additional languages to parse attribute values with.
-
-
htmlLanguage: LRLanguage A language provider based on the Lezer HTML parser, extended with the JavaScript and CSS parsers to parse the content of
<script>and<style>tags.-
htmlCompletionSource(context: CompletionContext) → CompletionResult | null HTML tag completion. Opens and closes tags and attributes in a context-aware way.
Type used to specify tags to complete.
Define tag-specific attributes. Property names are attribute names, and property values can be null to indicate free-form attributes, or a list of strings for suggested attribute values.
When set to false, don't complete global attributes on this tag.
Can be used to specify a list of child tags that are valid inside this tag. The default is to allow any tag.
-
htmlCompletionSourceWith(config: Object) → fn(context: CompletionContext) → CompletionResult | null Create a completion source for HTML extended with additional tags or attributes.
Extension that will automatically insert close tags when a
>or/is typed.