Visual Studio Code：如何自动格式化模板文本中包含的 HTML？

Question

在我的 Javascript 代码中，我有许多包含 HTML 代码的模板文字。这些块通过es6-string-html正确突出显示。但是，它们不会自动格式化，这意味着以下块将保持原样：

let html = `
      <div class="wrapper">
<div>Hello, world!
     </div>
                 </div>
      `;

如何为这些字符串启用自动格式设置？

Answer 1

当 Prettier 在 JavaScript 中检测到带有名为 html 标签的标记模板时，它将对其进行格式化。您可以在此处阅读有关此内容的更多信息，并且对于突出显示的内容，您可以使用您建议的es6-string-html

/**
 * html wrapper is needed for prettier formatting
 */
const html = String.raw;

const template = html`
  <div>
    <p>hello world</p>
    <p>hello world</p>
  </div>
`;