45

Is there a way (plugin, option, or tip and trick) to highlight HTML syntax in a JS string?

My document is a .js file, in which I use strings containing HTML code. Is it possible to highlight HTML syntaxe inside these strings?

enter image description here

Improve this question
3
  • Welcome to SO. I took the liberty to rephrase your question so that is more easily readable. Commented Mar 8, 2018 at 8:36
  • ok thank, english are not my natal language sorry for mistake.And stackflow delete some work like HI ! Commented Mar 8, 2018 at 11:10
  • 2
    No problem :) And I would not call it a mistake. SO tries to focus on the questions and greetings, thanks etc. are considered irrelevant to the question (fluff). Commented Mar 8, 2018 at 11:22

5 Answers 5

Reset to default
57

You can use the extension es6-string-html

Note: You need to add a comment with the language in front of the multiline string

Before and After

Improve this answer
Sign up to request clarification or add additional context in comments.

2 Comments

Sadly it doesn't appear to help with intilisense :(
intilisense is run by ts-server and its not process any strings
11

The extension that you suggested requires that you prefix your strings with a comment like /*html*/ or html. I'm working with Angular, and I didn't want to go through all my templates to prefix them, so I found this extension that does it automatically without prefixes:

https://marketplace.visualstudio.com/items?itemName=natewallace.angular2-inline

It is included in the Angular Essentials package by John Papa:

https://marketplace.visualstudio.com/items?itemName=johnpapa.angular-essentials

Improve this answer

1 Comment

perfect! it works for any js file, not only for Angular :)
6

You can try the extension leet-html. It works fine, without any prefix or comment to add, and not related to any framework.

enter image description here

Improve this answer

Comments

1

For Vue try Vue Inline Template:

https://marketplace.visualstudio.com/items?itemName=faisalhakim47.vue-inline-template

Improve this answer

1 Comment

Exactly what I need. Thanks!
1

The Template Literal Editor extension works for both VSCode and Open-VSX at the moment.

Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.