@nicktomlin/codemirror-lang-yaml-lite

Codemirror YAML Lite

This package provides CodeMirror language support for a partial version of the YAML 1.2 spec, and also contains the Lezer grammar that powers it.

Usage

In your project:

npm i @nicktomlin/codemirror-lang-yaml-lite

import {yaml} from "@nicktomlin/codemirror-lang-yaml-lite"

// TODO:... more here
new EditorView({
    extensions: [
        yaml
    ]
})

Contributing

Pull requests welcome; feature requests are DIY

I'll try to do what I can to fix bugs, but I'm satisfied with a subset of YAML behavior at the moment. If you'd like the parser augmented for your use case, please open a PR.

Development

Working with the parser:

# launch tests and parser in --watch mode
npm run dev

# run the UI (useful for previewing changes in CodeMirror)
npm run ui

FAQ

Why lite?

YAML is a notoriously complicated (or -- to put a positive spin on it -- flexible) data serialization language. As such, it's difficult to parse.

Why not use CM legacy-modes?

CodeMirror 6 supports basic yaml syntax highlighting through legacy streaming mode and you should use it if your use case is simple! But, it is not fully compatible with all of the features a "real" lezer parser provides. For example, that means it is not able to support mixed language parsing which prompted this package's development.

Prior art / References

• this thread
• this thread
• this thread on mixed language support
• this repo by @teucer
• the @codemirror/lang-javascript package is a great reference
• the legacy yaml mode

Right now I think we sort of need a full loop that helps us generate the grammar and then preview in the editor all at once...

Playgrounds

• This stackblitz starter
• https://littletools.app/lezer
• https://lezer-playground.vercel.app/