Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to syntax-highlight HTML inside JavaScript strings in VS code? [closed]

Is there any Vs Code extension to syntax-highlight HTML inside JavaScript strings?

Specifically I am writing web components

const html = content => `
  <div>
    <table>
      ${content}
    </table>
  </div>
`;

class BaseTable extends HTMLElement {
  constructor() {
    super();
  }

  set content(value) {
    const template = document.createElement('template');
    template.innerHTML = style + html(value);

    this.attachShadow({ mode: 'open' });
    this.shadowRoot.appendChild(template.content.cloneNode(true));
  }
}

I want string inside html constant variable to be highlighted

like image 965
Nurdaulet Shamilov Avatar asked Feb 13 '20 12:02

Nurdaulet Shamilov


People also ask

Does VS code have syntax highlighting?

Syntax highlighting determines the color and style of source code displayed in the Visual Studio Code editor. It is responsible for colorizing keywords like if or for in JavaScript differently than strings and comments and variable names.

What is enable highlighting error in VS code?

Launch VS Code Quick Open ( Ctrl+P ), paste the following command, and press enter. ErrorLens turbo-charges language diagnostic features by making diagnostics stand out more prominently, highlighting the entire line wherever a diagnostic is generated by the language and also prints the message inline.


1 Answers

If you use lit-html, There's a plugin in vs code called lit-plugin for syntax highlighting. Syntax is,

const markup = content => html`
  <div>
    <table>
      ${content}
    </table>
  </div>
`;

screenshot

like image 148
vishnu v Avatar answered Oct 05 '22 07:10

vishnu v