Question: Support for HTML highlighting in "template literal" strings in .JS files?

[wallheater]

I am working with Vue 3 without a build/compile step, using:

• .js files instead of .vue files
• template property in the component JS instead of <script> and <template> tags

...just like this example.

It is working well for me, except there is no syntax highlighting in the template content in VS Code, when in the JavaScript language mode. (And of course in HTML mode there is no syntax highlighting in the JS.)

Today I added the Vetur extension and tried all the vue-* language modes, and none seems to detect the template block. Is there any way to enable this in the extension?

(Also, is it correct to call this a "template literal"? It's been hard to google this topic.)

Similar concept in the es6-string-html extension, which depends on /*html*/ comments.

Code example linked above:

// my-component.js
export default {
  data() {
    return { count: 0 }
  },
  template: `<div>count is {{ count }}</div>`
}