如何在 Visual Studio 中获得 Vue 模板的语法突出显示（其中 HTML 位于 JS 字符串文字中）？

Question

我正在 Vue 3 中开发一个 Web 应用程序，其组件在 Javascript 文件中描述，包含 Javascript 字符串文字中的 HTML 模板，例如：

app.component('my-alert', {
    props: {
        status: String,
        content: String,
    },
    template:
        `<div class="alert" :class="'alert-'+status" role="alert">
          {{content}}
        </div>`
})

我的 IDE 是 Visual Studio 2019。 我知道 Visual Studio Code 的插件可以让 IDE 突出显示 JS 字符串文字中的 HTML 语法，如上面所示。 （例如，参见这个问题和这个其他问题。）我想知道的是，Visual Studio 2019有类似的插件吗？ 如果有多个，其中有没有专门为 Vue.js 开发设计的？

Answer 1

尝试 Visual Studio Code 的 es6-string-html 扩展

在字符串之前评论

/*html*/

Answer 2

作为@streetsummit 的补充信息。我添加一个例子。

export default {
    template: /*html*/`        
        <form @submit.prevent="add">
                <div class="border-gray-600 text-black">
                    <input v-model="NewTask" placeholder="new task" type="text" class="p-2"/>
                    <button type="submit" class="p-2 border-l bg-white">Add</button>
                </div>
        </form>
    `
}