簡體   English   中英

如何使用 VSCode Prettier 防止每個 html 元素結束標記換行?

[英]How to prevent a line break to every html element end tag using VSCode Prettier?

這是我目前在我的編輯器上擁有的。 這實際上是一個 Laravel Blade,所以文件名是page.blade.php 但是,我在files.associate上添加了這些;

"*.blade.php":"html"
<nav
    class="navbar navbar-standard navbar-expand-lg fixed-top navbar-dark navbar-theme"
>
    <div class="container">
        <a class="navbar-brand" href="../index.html"
            ><span class="text-white">{{ config("app.name") }}</span></a
        >
        <button
            class="navbar-toggler collapsed"
            type="button"
            data-toggle="collapse"
            data-target="#navbarStandard"
            aria-controls="navbarStandard"
            aria-expanded="false"
            aria-label="Toggle navigation"
        >
            <span class="navbar-toggler-icon"></span>
        </button>
    </div>
</nav>

因此,如果您注意到代碼片段, >總是打破界限,這並不好。 特別是在</a>標簽上。 我嘗試編輯HTML>Format: Wrapp Attributes ,但它不起作用,見附圖:

vs代碼設置

現在這就是我想要的。

<nav class="navbar navbar-standard navbar-expand-lg fixed-top navbar-dark navbar-theme">
    <div class="container">
        <a class="navbar-brand" href="../index.html">
            <span class="text-white">Logo</span>
        </a>
        <button class="navbar-toggler collapsed" type="button" data-toggle="collapse" data-target="#navbarStandard" aria-controls="navbarStandard" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>
    </div>
</nav>

只需單擊右下純文本,它將打開一個對話框,輸入 html 和 SELECT html

然后右鍵單擊並選擇格式文檔。它會像你想要的那樣格式化文件

只需單擊右下純文本,它將打開一個對話框,輸入 html 並選擇 HTML。 見圖1。

然后右鍵單擊並選擇格式文檔。 它會像你想要的那樣格式化文件。 見圖2。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM