Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Force VS Code to Syntax Highlight a part of a file differently

My most current HTML/CSS/TS project is being done with HTML components. And, in that context, it's pretty common to use strings to set up the inner HTML of components. So we have stuff like this everywhere:

this.innerHtml = `
  <p>Blah blah</p>
`

Since the syntax highlighter only sees a string, everything within it is typically green or whatever other color. But I wish there was a way of making it highlighted as HTML code. Is there a way? Is there maybe a VS Code Extension for it?

I imagine a VS Code Extension could work by putting a comment on the line before (or two) the HTML code, something like this:

// extension:begin:html
this.innerHtml = ` 
  <p>Blah Blah</p>
`
// extension:end
like image 951
Philippe Fanaro Avatar asked Sep 17 '25 11:09

Philippe Fanaro


1 Answers

As @epascarello pointed out, the es6-string-html mostly does what I wanted.

The only thing I would change is I would have HTML as some sort of default in the settings, since, in my project, that's the only thing I need.

like image 173
Philippe Fanaro Avatar answered Sep 19 '25 02:09

Philippe Fanaro