Custom Syntax Highlighting of Text

I want to do custom syntax highlight for words in CodeMirror and track values in handlebars and show a color depending if the value is correct or not.

so {{true}} would show green, and {{false}} would show in red.

A sentence of “Hello this is {{true}} and {{false}}” would have the words in the handlebars stylized accordingly.

What is the simplest way to implement this, do I need to do a custom grammar or is there an easier method?

2 Likes

You can do this without a grammar, if you want. You’d need to write a view plugin that builds up a set of decorations for the visible text, and updates it when necessary.

My needs are exactly like yours, I refer to the link below, implemented this feature.
https://codemirror.net/examples/zebra/

I will post my code here if you need to

2 Likes

Can you help with code here please. I am working on it with react.