如何在 VScode 中格式化 HTML 代码？答案

【问题标题】：How to format HTML code in VScode ?如何在 VScode 中格式化 HTML 代码？
【发布时间】：2017-10-03 22:13:36
【问题描述】：

我想找到一种在 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？

谢谢！

【问题讨论】：

标签： html formatting visual-studio-code

【解决方案1】：

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

【讨论】：

【解决方案2】：

你也可以和html.format.wrapLineLength组合使用。

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

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

【讨论】：