+1, ich und mein Team brauchen dieselbe Funktion, und es scheint dieselbe Funktion zu sein, wie sie hier angefordert wird: https://github.com/beautify-web/js-beautify/issues/1262
Ich habe genau diese Funktion gesehen, die auch bei VSCode github angefordert wurde: https://github.com/Microsoft/vscode/issues/2204 (letzter Kommentar)

Ich habe ein bisschen mit dem Quellcode gespielt und habe eine Implementierung, die zu funktionieren scheint: eine neue Option für "wrap_attributes" - "aligned", die die attrs nicht zum Umbrechen zwingt, es sei denn, die Zeilenlänge ist erreicht, und sie richtig ausrichtet, wenn die Zeile wird umbrochen.

Kann so etwas funktionieren, @bitwiseman?

Wenn ja, könnten wir die Details besprechen oder ich kann eine PR eröffnen. (Aber um ehrlich zu sein, ich bin nicht gerade ein Open-Source-Experte und etwas verwirrt über die Tests und die Python-Version und so weiter). Nun, HTML-Beautifier gibt es in Python nicht, also ist es vielleicht kein Problem :) Also wird eine Anleitung geschätzt!

@cheerypick
Vielen Dank, dass Sie sich an der Umsetzung beteiligt haben.

Ja, Sie müssen sich keine Gedanken über die Python-Version für HTML-Beautifier-Änderungen machen - es gibt noch keine Python-Implementierung für dieses Modul.

Stellen Sie zum Testen sicher, dass Sie den Build ausführen können und er lokal funktioniert. Aktualisieren Sie dann test/data/html/tests.js . Wenn Sie den Build erneut ausführen, werden die ausführbaren Tests aus dieser Datendatei neu generiert. Ein Beispiel dafür sehen Sie in #1158 . Wenn Sie zuerst einige einfache Tests ausprobieren möchten, cool. Wenn Sie verstehen, wie die Testgenerierung matrix funktioniert, fügen Sie Ihren neuen Wert zu den Attributumbruchtests unter test/data/html/tests.js#L323 hinzu .

Was auch immer der Fall ist, Sie können jederzeit eine PR starten, und wir können dort diskutieren.

Danke noch einmal.

(Wenn Sie bereit wären, CONTRIBUTING.md mit zusätzlichen Anweisungen zu aktualisieren, die Sie für erforderlich halten, wäre dies ebenfalls wünschenswert, aber nicht erforderlich.)

@cheerypick - Danke auch, dass du das Duplikat bemerkt hast. Bitte setzen Sie diese Diskussion in #1262 fort.

Eine Randnotiz dazu: Ich habe eigentlich nach der Kombination dieser beiden Einstellungen gesucht, aber jetzt gefällt das vorgeschlagene Beispiel. Was ich brauche, ist, dass VSCode die Attribute in Ruhe lässt, und wenn das Element länger als 120 wird, werden die Attribute in neuen Zeilen angeordnet. Ich möchte also Folgendes:

<div class="form-check form-group row">
  <label class="custom-control custom-checkbox" id="referral-filter-checkbox-label">
    <input type="checkbox" class="custom-control-input" id="referral-filter-checkbox" ng-checked="$ctrl.filterReferralsRx | async : this" ng-click="$ctrl.toggleFilterReferrals()">
    <input type="checkbox" class="custom-control-input"
           id="referral-filter-checkbox" 
           ng-checked="$ctrl.filterReferralsRx | async : this" 
           ng-click="$ctrl.toggleFilterReferrals()">
    <span class="custom-control-indicator"></span>
    <span class="custom-control-description text-nowrap">{{ 'MODEL.INBOX.ACTION.FILTER' | translate }}</span>
  </label>
</div>

zu:

<div class="form-check form-group row">
  <label class="custom-control custom-checkbox" id="referral-filter-checkbox-label">
    <input type="checkbox"
           class="custom-control-input"
           id="referral-filter-checkbox"
           ng-checked="$ctrl.filterReferralsRx | async : this"
           ng-click="$ctrl.toggleFilterReferrals()">
    <input type="checkbox" class="custom-control-input"
           id="referral-filter-checkbox" 
           ng-checked="$ctrl.filterReferralsRx | async : this" 
           ng-click="$ctrl.toggleFilterReferrals()">
    <span class="custom-control-indicator"></span>
    <span class="custom-control-description text-nowrap">{{ 'MODEL.INBOX.ACTION.FILTER' | translate }}</span>
  </label>
</div>

Beachten Sie die zweite Eingabe, wo Sie die Attribute in Ruhe lassen sollten, da sie nicht länger als 120 Zeichen sind + sie bereits ausgerichtet sind.

Was ich also sehen möchte, ist, dass Sie anstelle einer Kraft sicherstellen, dass sie ausgerichtet sind, wenn sie mehrzeilig sind, und sie mehrzeilig setzen, wenn die Zeile mehr als 120 Zeichen umfasst.

Visual Studio (nicht Code) formatiert HTML standardmäßig auf diese Weise (ausgerichtet, aber nicht erzwungen). Wäre schön, wenn Code das auch könnte.

Bitte fügen Sie die Funktion hinzu, damit mein HTML-Template-Code nicht extrem lang wird.

Dies ist sehr erwünscht. @cheerypick planst du immer noch, eine PR dafür zu machen?

Funktioniert bei mir nicht in VSCode.
In .vue-Datei
Erweiterungen: Schöner, Vetur
:-(

@christoferd
Ich weiß nicht, was du sagst, bitte chatte auf dem Gitter-Kanal, anstatt Kommentare zu einem geschlossenen Problem hinzuzufügen.

Ich habe dieses Problem erneut gesehen, nachdem ich den VScode auf die neueste Version aktualisiert habe. Version 1.30.2 auf Mac OS High Sierra. Es war auf Auto eingestellt und plötzlich beginnt mein Code zu umbrechen. Versuchte Kraftausrichtung und es funktioniert auch nicht.

@aybhalala @christoferd Bitte geben Sie genau an, was Sie sehen. Kommen Sie auf gitter chatten oder öffnen Sie ein neues Problem.

@bitwiseman Entschuldigung. Ich habe gerade herausgefunden, dass es ein Problem mit dem Prettier-Plugin war. Danke für die Antwort.