microsoft / vscode-textmate

A library that helps tokenize text using Text Mate grammars.
MIT License
585 stars 116 forks source link

Documentation for browser use? #244

Open mihailik opened 1 month ago

mihailik commented 1 month ago

I just want to use this library, as a library, not as VSCode accessory. Is that supported?

Do you need help making it useful for the community?

If you direct me towards understanding how this can be used for a browser project, I promise to make a PR for a sensible, helpful README and some use cases.

Because right now it's a total mess, like the original writer was promoted to management in 2018 or something.

![Image](https://github.com/user-attachments/assets/b352d246-5800-4443-9e05-a3a87f768880) ![Image](https://github.com/user-attachments/assets/fddff9de-6f26-48f9-9f85-a4353fa926ab)

What is this README???

Image

RedCMD commented 1 month ago

that Readme shows a basic implementation of VSCode's TextMate in javascript I guess it assumes that you already know what TextMate grammars are

are you not able to import (require) other packages in the web?

oniguruma is the regex library that TextMate uses it is written in C, so it had to be converted to wasm to run on the web

source.js is the scope name that is assigned to the JavaScript language

you can use the await syntax instead of then()

Vue has a syntax playground, idk if it's any use to you also https://textmate-grammars-themes.netlify.app/ and https://github.com/thetarnav/tmjs here's my implementation (as a VSCode extension) https://github.com/RedCMD/TmLanguage-Syntax-Highlighter/blob/main/src/TextMate.ts

Why are you wanting to use the VSCode's TextMate library? There is also Tree-sitter and highlight.js

mihailik commented 2 weeks ago

I think your assessment is 100% correct, those other libraries are a more appropriate choice.

Picked highlight.js and within 1 hour had it working, embedded in my own editor and integrated.

The quality of the docs may be indicative of the code quality. I'll leave this ticket open to nudge the VSCode team into improvement.

zm-cttae commented 1 week ago

Everything needed to make this library work in the browser is at vscode-textmate-languageservice You're welcome to cannibalise it or install it as needed - its very stable and should never change.

If your use is in an extension and not a library of your own, this is the best way to bundle onig.wasm:

const uri = vscode.Uri.joinPath(context.extensionUri, 'node_modules/vscode-oniguruma/release/onig.wasm');
const stream = fetch(uri.toString());
await vscodeOniguruma.loadWASM({ data: await stream });

CopyWebpackPlugin also works nicely if you want to adjust the path from node_modules.