Render styled Lezer syntax trees to hast
npm install hast-util-from-lezer   !TypeScript types
Render styled Lezer syntax trees to hast.
- Install
- Usage
- API
- Contributing
- License
``
npm i hast-util-from-lezer
`typescript
import { fromLezer } from "hast-util-from-lezer"
import { parser as javascriptParser } from "@lezer/javascript"
import { toHtml } from "hast-util-to-html"
const source = function norm(a: number, b: number): number {
return Math.sqrt(Math.pow(a, 2) + Math.pow(b, 2))
}
const tree = javascriptParser.parse(source)
const element = fromLezer(source, tree)
console.log(toHtml(element))
`
yields the following HTML:
`
function norm(a: number, b: number): number {
return Math.sqrt(Math.pow(a, 2) + Math.pow(b, 2))
}
`typescript
import type { Tree } from "@lezer/common"
import type { Root } from "hast"
declare function fromLezer(source: string, tree: Tree): Root
`
tree must already be styled if you want highlighting classnames in the resulting hast. This means the Lezer grammar you're using has to support highlight style props, typically included with a highlight.js file and a @external propSource` directive in the grammar source. All the Lezer grammars maintained by the Lezer project do; you shouldn't have to worry about it.
hast-util-from-lezer is meant to be a minimal utility library - it's unlikely that I'll want to add new features to it, but if you find bugs, have interface or API suggestions, or general feedback, feel free to open an issue to discuss it!
MIT (c) 2024 Joel Gustafson