https://github.com/devongovett/tree-sitter-highlight
A syntax highlighter for Node powered by Tree Sitter. Written in Rust.
https://github.com/devongovett/tree-sitter-highlight
Last synced: about 1 year ago
JSON representation
A syntax highlighter for Node powered by Tree Sitter. Written in Rust.
- Host: GitHub
- URL: https://github.com/devongovett/tree-sitter-highlight
- Owner: devongovett
- License: mit
- Created: 2021-12-22T00:54:18.000Z (over 4 years ago)
- Default Branch: master
- Last Pushed: 2023-03-13T17:48:23.000Z (over 3 years ago)
- Last Synced: 2024-10-10T00:11:12.448Z (over 1 year ago)
- Language: Rust
- Size: 9.77 KB
- Stars: 235
- Watchers: 4
- Forks: 6
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# tree-sitter-highlight
A syntax highlighter for Node.js powered by [Tree Sitter](https://github.com/tree-sitter/tree-sitter). Written in Rust.
## Usage
The following will output HTML:
```js
const treeSitter = require('tree-sitter-highlight');
treeSitter.highlight('const foo = "hi";', treeSitter.Language.JS);
// => '...'
```
You can also output a [HAST](https://github.com/syntax-tree/hast) AST, which is useful for integrating with Markdown or MDX processors (e.g. Remark).
```js
treeSitter.highlightHast('const foo = "hi";', treeSitter.Language.JS);
// => {type: 'element', children: [...]}
```
## Themes
The output HTML will contain CSS class names for various tokens. These will depend on the language, but there are several common names used across languages. Here is a basic example theme:
```css
.keyword {
color: purple;
}
.function {
color: blue;
}
.type {
color: pink;
}
.string {
color: green;
}
.number {
color: brown;
}
.operator {
color: gray;
}
.comment {
color: lightgray;
}
```
Inspect the generated output HTML and design your CSS accordingly.
## License
MIT