Javascript 中的 HTML 语法高亮、格式化和 emmet 片段？答案

【问题标题】：HTML syntax highlighting, formatting, and emmet snippets in Javascript?Javascript 中的 HTML 语法高亮、格式化和 emmet 片段？
【发布时间】：2021-06-24 04:36:44
【问题描述】：

我正在尝试使用模板字符串文字编辑 Javascript 文件中的 HTML，但我无法获得与 HTML 文件中相同的所有功能。

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

我尝试过使用扩展和语法高亮，但使用 prettier 和 emmet sn-ps 格式化不起作用：

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

WebStorm 有语法高亮和 emmet sn-ps 但没有格式化。但是，我更喜欢使用 VS Code。如果有人知道解决方案，我将非常感激！

编辑：我正在使用 Vanilla Javascript。

【问题讨论】：

这真的是一个react文件吗？
@Teemu 不，Vanilla Javascript。
然后，您必须将模板之外的所有内容都用引号括起来，或者更确切地说是创建一个模板字符串。如果你只是显示一个真实的代码......另外，你说它是vanilla JS，“html”不是JS中的关键字。
这能回答你的问题吗？ How to interpolate variables in strings in JavaScript, without concatenation?
看看上面的链接，应该会有帮助。

标签： javascript visual-studio-code

【解决方案1】：

我通过编辑 VS Code Emmet Include Languages 设置解决了 JS 中的 emmet sn-ps。

YouTube: Enable emmet abbreviations in any language

使用语法高亮的扩展（lit-html 或 es6-string）。我唯一想不通的是使用 Prettier 对 JS 中的 html 进行代码格式化。如果我这样做会更新。

【讨论】：