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

Philippe Fanaro 0
Viewed 30

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
vscode-extensions visual-studio-code html
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.

Philippe Fanaro0
Related