3

I'm developing a web app in Vue 3, with components described in Javascript files, containing HTML templates in Javascript string literals, for example:

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

My IDE is Visual Studio 2019. I'm aware of plugins for Visual Studio Code which enable that IDE to highlight HTML syntax in JS string literals like the above. (See this question and this other question for example.) What I want to know is, are there any similar plugins for Visual Studio 2019? If there are more than one, are any of them especially designed for Vue.js development?

workerjoe
  • 2,421
  • 1
  • 26
  • 49
  • Why do you use Visual Studio for Vue development? – tauzN Apr 05 '21 at 18:44
  • 1
    @tauzN The back-end of our app is ASP.NET MVC and our team is used to Visual Studio. VS Code is a separate product and we don't want to run two different IDEs. – workerjoe Apr 05 '21 at 18:49
  • Fair enough. Unfortunately, I don't think you will find anything as good, or even close to VS Code. You might be able to just open the respective files in VS Code, and compile/build in VS as usual. – tauzN Apr 05 '21 at 18:52
  • This might not be the answer you want, but if you really want this when most people use VSCode... it is not hard to create a Visual Studio extension. You need to create a `Grammar` folder with a JSON file (can reuse the ones from [here](https://github.com/faisalhakim47/vscode-vue-inline-template/tree/master/syntaxes)) and a `tmTheme` file, plus some other files. I have done this for another language. If there is more interest I can provide a complete answer. – Zhe Dec 18 '22 at 15:08

1 Answers1

0

Try es6-string-html extension for Visual Studio Code

Comment /*html*/ before your string

streetsummit
  • 11
  • 2
  • While this link may answer the question, it is better to include the essential parts of the answer here and provide the link for reference. Link-only answers can become invalid if the linked page changes. - [From Review](/review/late-answers/31073636) – mbuechmann Feb 21 '22 at 13:44