Highlight your code using tree-sitter-highlight

Related tags

Code highlighting rehype-tree-sitter-highlight
Overview

rehype-tree-sitter-highlight

highlight your code using tree-sitter-highlight

Installation

npm install rehype-tree-sitter-highlight

Usage

This is a rehype plugin. To highlight code blocks in html:

import fromHtml from 'rehype-parse'
import toHtml from 'rehype-stringify'
import rehypeTreeSitterHighlight from 'rehype-tree-sitter-highlight'
import { unified } from 'unified'

const doc = "```js\nconst hello = 'World';\n```\n"

async function createProcessor() {
  const processor = unified()
    .use(fromHtml)
    .use(rehypeTreeSitterHighlight)
    .use(toHtml)

  return processor
}

const processor = await createProcessor()
const vfile = await processor.process(doc)
console.log(vfile.toString())

Configuration

Theme

Refer to the tree-sitter-highlight docs for information on how to theme the output html.

Supported Languages

Refer to the tree-sitter-highlight for supported languages.

Unknown Languages

Unknown languages are ignored by default. You can set ignoreUnknownLanguage: false to throw an error when an unsupported language is encountered.

Examples

See examples for ways to use this plugin.

Inspiration

Much of the docs and code is taken from rehype-shiki.

Comments
Releases(v1.0.2)
Owner
Sachin Raja
React, TypeScript enjoyer. Interested in speed ⚑
Sachin Raja
GitHub
Linter for Nix using tree-sitter 🌳 + ❄️

Linter for Nix using tree-sitter ?? + ❄️ This is a simple linter for Nix that uses tree-sitter. I plan on extending it with more detections in the fut

Ben Siraphob 41 Dec 20, 2022
A simple C++ function parser/tagger based on tree-sitter

What the func?! - A simple C++ function parser/tagger This project implements a simple C++ function parser, what-the-func, based on the tree-sitter C+

Software and Systems Engineering Chair 4 - Faculty of Informatics 3 May 21, 2022
Pickle tree - Javascript tree component made with pure javascript

Pickle Tree Pickle tree is a tree component written as completely pure javascript. Just send json file to object and have fun :-D Pickle tree does't n

Kadir Barış Bozat 17 Nov 13, 2022
Fancytree - JavaScript tree view / tree grid plugin with support for keyboard, inline editing, filtering, checkboxes, drag'n'drop, and lazy loading

Fancytree Fancytree (sequel of DynaTree 1.x) is a JavaScript tree view / tree grid plugin with support for keyboard, inline editing, filtering, checkb

Martin Wendt 2.6k Jan 9, 2023
Syntax highlight using VSCode's json/plist as is.

WIP dps-vsctm.vim Syntax highlight using VSCode's json/plist as is. Requirements denops.vim Usage First, the grammar definition file must be placed in

NAKAI Tsuyoshi 68 Dec 26, 2022
Convert Your Kindle highlight & Note to Markdown/JSON

kindle-highlight-to-markdown Convert Your Kindle highlight & Note to Markdown/JSON Install Install with npm: npm install kindle-highlight-to-markdown

azu 15 Dec 31, 2022
Mimic tree-shaking behaviour when importing code from an entry file in development mode.

vite-plugin-entry-shaking Mimic tree-shaking behaviour when importing code from an entry file in development mode. Warning This plugin is experimental

n028 11 Dec 19, 2022
Line focus plugin for Highlight.js

Highlight.js Focus Plugin This plugin provide the ability to highlight a focused line when using Highlight.js To use, first, register this plugin with

Huy 8 Jun 20, 2022
Syntax implementation of Laravel's's Blade language for highlight.js

Blade language definition for Highlight.js Syntax implementation of Laravel's's Blade language for highlight.js. Support us We invest a lot of resourc

Spatie 12 Jul 6, 2022
A plugin for obsidian to focus and highlight on a specific heading in Reading mode.

Focus and Highlight A plugin for obsidian to focus on a specific paragraph in Reading mode. Features Focus on a specific heading and its children when

Bo-Yi Tsai 22 Dec 21, 2022
A CSS stylesheet to quickly highlight a11y concerns.

Checka11y.css A CSS stylesheet to quickly highlight a11y concerns. Lightweight β€’ Modern β€’ Accessibile β€’ Customisable β€’ Simple The first line of defenc

Jack Domleo 428 Dec 25, 2022
Steam - Highlight specific friends who play

highlight-friends Steam Website - Highlight specific friends who play https://greasyfork.org/en/scripts/450409-highlight-specific-friends-who-play?loc

Roman Davydov 6 Nov 6, 2022
"Jira Search Helper" is a project to search more detail view and support highlight than original jira search

Jira Search Helper What is Jira Search Helper? "Jira Search Helper" is a project to search more detail view and support highlight than original jira s

null 41 Dec 23, 2022
Highlight the Web ✏️✨

Marker is a Browser Add-On that lets you draw on any Website. Please first navigate to a website, then press on the toolbar button to activate the add

Robin RΓΆper 10 Nov 14, 2022
NodeJS Implementation of Decision Tree using ID3 Algorithm

Decision Tree for Node.js This Node.js module implements a Decision Tree using the ID3 Algorithm Installation npm install decision-tree Usage Import

Ankit Kuwadekar 204 Dec 12, 2022
A VS Code extension to practice and improve your typing speed right inside your code editor. Practice with simple words or code snippets.

Warm Up ?? ??‍?? A VS Code extension to practice and improve your typing speed right inside your code editor. Practice with simple words or code snipp

Arhun Saday 34 Dec 12, 2022
A web app that shows visualizations of the most used graphs algorithms such as BFS, DFS, Dijsktra, Minimum spanning tree, etc. It allows you to draw your own graph.

Graph Visualizer Draw your own graphs and visualize the most common graph algorithms This web application allows you to draw a graph from zero, with p

Gonzalo Pereira 31 Jul 29, 2022
This package is an open source extension for MikroORM, which enables Nested Set Tree for your needs

MikroORM nested set This package is an open source extension for MikroORM, which enables Nested Set Tree for your needs Disclaimer For now, this packa

Kamil Fronczak 5 Dec 15, 2022
jQuery plugin to show a tree structure in a table

jQuery treetable jQuery treetable is a plugin for jQuery, the 'Write Less, Do More, JavaScript Library'. With this plugin you can display a tree in an

Ludo van den Boom 734 Nov 14, 2022
A refined tool for exploring open-source projects on GitHub with a file tree, rich Markdown and image previews, multi-pane multi-tab layouts and first-class support for Ink syntax highlighting.

Ink codebase browser, "Kin" ?? The Ink codebase browser is a tool to explore open-source code on GitHub, especially my side projects written in the In

Linus Lee 20 Oct 30, 2022