如何格式化VScode中的HTML代码？

Question

我想找到一种在VScode中格式化HTML的方法，例如，如果我有一个像这样的长div：

<div class="signal-item-icon checkbox-signal signal-icon" [class.selected]="signal.isSelectedCheckSign" (click)="$event.stopPropagation(); onSelectOneShadowSignal(signal);">

当我按ctrl + shift + i：

时，我希望它显示如下

<div class="signal-item-icon checkbox-signal signal-icon" 
     [class.selected]="signal.isSelectedCheckSign" 
     (click)="$event.stopPropagation(); 
     onSelectOneShadowSignal(signal);">

如果有可能，你呢？是否存在用于此类实现的扩展VScode？

谢谢！

Answer 1

将VSCode首选项html.format.wrapAttributes设置为force将完成示例中的格式设置。

Answer 2

您也可以将html.format.wrapLineLength组合使用。

html.format.wrapLineLength = 80;
html.format.wrapAttributes": "auto",

在这种情况下，属性在行长度超过80时开始换行。当你有很多属性时它会很有用，它会填充右边的空白区域。