HTML syntax highlighting, formatting, and emmet snippets in Javascript?

Question

I'm trying to edit HTML in a Javascript file using template string literals but I'm unable to get all the same features like I would in an HTML file.

return (template string quotes) <p>Hello World</p> (template string quotes)

I've tried using extensions and the syntax highlighting works but formatting with prettier and emmet snippets doesn't work:

div#idName or div.className or ul>li*3 all don't work.

WebStorm has syntax highlighting and emmet snippets but no formatting. However, I'd prefer using VS Code. If anyone knows a solution I'd be extremely grateful!

Edit: I'm using Vanilla Javascript.

Then you've to wrap everything outside of the templates in quotes, or maybe rather create a single template string. If you'd just show a real code ... Also, you say it's vanilla JS, "html" is not a keyword in JS. — Teemu
– Teemu, Commented Jun 24, 2021 at 5:06
Does this answer your question? How to interpolate variables in strings in JavaScript, without concatenation? — JAYD3V
– JAYD3V, Commented Jun 24, 2021 at 5:34

Gama11 · Accepted Answer · 2021-07-18 10:56:02Z

2

I've solved emmet snippets in JS by editing the VS Code Emmet Include Languages settings.

YouTube: Enable emmet abbreviations in any language

Using an extension for syntax highlighting (lit-html or es6-string). Only thing I couldn't figure out is code formatting with Prettier for the html inside JS. Will update if I do.

edited Jul 18, 2021 at 10:56

Gama11

34.6k9 gold badges92 silver badges107 bronze badges

answered Jun 24, 2021 at 6:05

Moody

1642 silver badges11 bronze badges

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

Collectives™ on Stack Overflow

HTML syntax highlighting, formatting, and emmet snippets in Javascript?

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related