[英]How to format HTML code in VScode ?
I would like to find a way to format HTML in VScode, such as fro example, if I have a long div like this one:我想找到一种在 VScode 中格式化 HTML 的方法,例如,如果我有一个像这样的长 div:
<div class="signal-item-icon checkbox-signal signal-icon" [class.selected]="signal.isSelectedCheckSign" (click)="$event.stopPropagation(); onSelectOneShadowSignal(signal);">
I want it to be displayed like this when I do ctrl+shift+i:我希望它在我执行 ctrl+shift+i 时显示如下:
<div class="signal-item-icon checkbox-signal signal-icon"
[class.selected]="signal.isSelectedCheckSign"
(click)="$event.stopPropagation();
onSelectOneShadowSignal(signal);">
Do you if it is possible?如果可能的话,你会吗? Is there an extension VScode that exists for this kind of implementation?
是否存在用于这种实现的扩展 VScode?
Thank you !谢谢 !
将 VSCode 首选项html.format.wrapAttributes
设置为force
将完成示例中的格式设置。
You can also use it with combination of html.format.wrapLineLength
.您也可以将它与
html.format.wrapLineLength
组合使用。
"html.format.wrapLineLength": 80,
"html.format.wrapAttributes": "auto",
In this case, attributes starts wrapping when line length exceeds 80
.在这种情况下,当行长超过
80
时,属性开始换行。 It's useful when you have many attributes and it will fill the empty spaces on the right.当你有很多属性时它很有用,它会填补右边的空白。
I think a better solution would be to use the VSCode html.format.wrapAttributes
option of force-aligned
.我认为更好的解决方案是使用
force-aligned
的 VSCode html.format.wrapAttributes
选项。 This doesn't blur the line between the next nested object and your attributes of your parent.这不会模糊下一个嵌套对象与您的父级属性之间的界限。 (In most cases).
(在大多数情况下)。
force力量
<form attribute1="value"
attribute2="othervalue">
<div></div>
</form>
force-aligned力对齐
<form attribute1="value"
attribute2="othervalue">
<div></div>
</form>
In my opinion, the first option makes it harder to find the div inside the form.在我看来,第一个选项使在表单中找到 div 变得更加困难。 And I've seen it cause many developers headaches when this happens.
当这种情况发生时,我已经看到它引起了许多开发人员的头痛。
<form attribute1="value">
attribute2="othervalue"
<div></div>
</form>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.