zikaari
codemirror runMode question and demo appears to be broken
Hey, thanks for tackling this issue!
I'm wondering whether I could use this to just use CMs syntax highlighting via runMode method. Unfortunately, the code in this repo is is a bit on the daunting side, and I'm not sure what I need to do.
I also tried the demo, but it doesn't start due to a hecking ton of typescript errors which are above my paygrade.
I feel your pain mate. Something that worked is no longer working (probably due to lack of a lock file, yarn is installing latest versions of things that matches the version string)
I'll look into this by the end of this week.
But if all you need is straight up tokenization, there are some easy to use low-level libraries that you might like:
-
monaco-textmate -
shiki
Let me know if they serve your use case. If not then, briefly explain your case and I might be able to suggest something.
Hey, thanks for taking the time!
I'm currently building a github file tree/preview browser extension and was aiming for best-in-class syntax highlighting. highlightjs and others are unfortunately very far from accurate :)
Shiki looks amazing, but is unfortunately built in a way that just assumes it's run in a node environment with fs available. gonna have to see whether I can get anywhere with something like memfs. Wish I could feasibly just do the syntax highlighting on a server somewhere, but that's probably a bad idea with private repositories ;)
I guess I'll try to drop down to using monaco-textmate directly 🤷♂
Edit: I'm doing this in react, so good syntax highlighting for jsx is especially important to me, which none of the classic browser options do well.
well good that you described your situation quite well, because in all honesty, codemirror-textmate is not what you want, monaco-textmate is the real solution here. Also Github doesn't use codemirror anyway, so it's not like you'd have tapped into their existing architecture. You'll get much better performance if you use monaco-textmate than codemirror-textmate because latter uses more "adapters" to go from raw string to codemirror compatible tokens, as opposed to going from raw string to "pure" tokens.
BTW since you mentioned file tree and you mentioned that you're building this in React, you might like something that I put too much love into.
Let me know when the extension is ready.
Oh shit you're the react-aspen guy! That's a super impressive project, kudos! I'm currently rendering recursively into Fragments, so the the overall DOM structure is not nested. Performance is currently pretty good, the usual github repo is kinda 'medium' in size, but I'll be sure to try out aspen should I run into issues!
Thanks for your help! I ended up settling for Prism for now, but I'll play around with monaco-textmate and see where that goes.
Ninja Edit: So it seems like chrome extension are not even allowed to run wasm in the first place becaus of CSP, and using 'unsafe-eval' is outta the question for me. Curiously, there seems? to exist a 'wasm-eval' but that doesn't seem to work either. I'll shelve this for now, I think.
And also: https://chrome.google.com/webstore/detail/tako-%E2%80%94-github-file-tree/fdmdpnmffpjdkjaapcbdnkhnidhgoabe Let me know if it works, or more likely, doesn't :D
So it seems like chrome extension are not even allowed to run wasm in the first place because of CSP, and using 'unsafe-eval' is outta the question for me
Perhaps you're doing all this in the extension's content-script context? If yes, then I must say that I've never liked it very much. Most extensions that I've seen, and worked on, will use content-script just to inject a "bootstrapper" script into the page, and that script will then switch to normal privileges instead of content-script priviledges. Where you should be able to load the wasm file (using runtime.geturl somehow)
@zikaari any chance you could take a look at this and pick through the TS issues? I'm happily using monaco-textmate for my own stuff but am locked into codemirror for something else I want to do.
