如何使用Prettier在新行上關閉HTML標簽？

Question

在編寫純HTML時，我試圖通過Prettier實現以下輸出：

<div class="foo"></div>

<div
  class="foo"
  id="bar"
>
</div>

請注意，具有多個屬性的div上的結束div標簽是如何在單獨的一行上顯示的（對於具有單個/無屬性的div而言，所有容器都在一行上）。

我相信--jsx-bracket-same-line設置為false可以在JSX中實現所需的結果，但是我正在嘗試在常規HTML中實現這一點。

我願意在Prettier中使用其他插件或ESLint設置。

Answer 1

如果只有HTML文件，則可以將默認解析器更改為lwc而不是HTML 。 此更改會將所有解析器轉換為lwc

{
    "parser": "lwc"
}

如果您有多種不同的文件類型，最好只申請*.html文件，然后將以下內容放入.prettierrc.

{
  "overrides": [{ "files": "*.html", "options": { "parser": "lwc" } }]
}