Js-beautify: HTML: Fügen Sie eine Option hinzu, um das manuelle Umschließen von Attributen beizubehalten

Dies ist eine großartige Idee, keine der Optionen ermöglicht das manuelle Umwickeln.

Es wäre großartig, eine Option zu haben, die force|force-aligned|force-expand-multiline nur dann ausführt, wenn die Zeilenumbruchlänge (Standard 120) erreicht wurde, da auto nur so viele Attribute umbricht, wie es nötig ist. Etwas wie auto-expand-multiline|auto-aligned Optionen?

@Robula
Bitte öffnen Sie eine neue Ausgabe für das, was Sie in Ihrem zweiten Absatz haben.

@Montago , @Andikki - was du beschreibst ist eine Option namens unchanged oder preserve , richtig?

@bitwiseman nein, nur eine andere Option wie "Force-Aligned" ... aber stattdessen "auto-aligned"

Es sollte einfach alle Attribute ausrichten, die manuell umschlossen wurden.
alle anderen Elemente / Attribute bleiben unberührt.

@Montago - Ah, also eher align-only .

ja das macht Sinn :)

stoße dafür!

Es wäre großartig, einige Attribute manuell in einer neuen Zeile und einige in derselben Zeile zu haben. Dann kann ich entscheiden, welche ich möchte und alles andere wird automatisch formatiert. Danke

@bitwiseman Ich denke nicht, dass eine Ausrichtung erforderlich ist, aber wenn dies der Fall ist, müssen zwei Optionen vorhanden sein - eine zum Anwenden der üblichen indent_size, eine andere zum Ausrichten - und das alles unter Beibehaltung der anfänglichen Zeilenumbrüche.

Beispiel
Quelle:

<input type="text"     class="form-control"  autocomplete="off" 
      [(ngModel)]="myValue"          [disabled]="isDisabled" [placeholder]="placeholder" 
  [typeahead]="suggestionsSource" [typeaheadOptionField]="suggestionValueField" [typeaheadItemTemplate]="suggestionTemplate"   [typeaheadWaitMs]="300"
                        (typeaheadOnSelect)="onSuggestionSelected($event)" />

Nur Einrückung erzwingen:

<input type="text" class="form-control" autocomplete="off" 
  [(ngModel)]="myValue" [disabled]="isDisabled" [placeholder]="placeholder" 
  [typeahead]="suggestionsSource" [typeaheadOptionField]="suggestionValueField" [typeaheadItemTemplate]="suggestionTemplate" [typeaheadWaitMs]="300"
  (typeaheadOnSelect)="onSuggestionSelected($event)" />

Nur Ausrichtung erzwingen:

<input type="text" class="form-control" autocomplete="off" 
       [(ngModel)]="myValue" [disabled]="isDisabled" [placeholder]="placeholder" 
       [typeahead]="suggestionsSource" [typeaheadOptionField]="suggestionValueField" [typeaheadItemTemplate]="suggestionTemplate" [typeaheadWaitMs]="300"
       (typeaheadOnSelect)="onSuggestionSelected($event)" />

Ich bin mir nicht sicher, ob dies das richtige Problem ist, um dies anzufordern, aber ich denke, eine auto-align Option sollte sich wie auto ; Zeilenumbruch nach einem bestimmten Spaltenabbruch, und wenn eine Zeile umbrochen wird, wird das Tag wie force-align .

Beispiel
Ausrichtung erzwingen, wenn die Zeilenlänge größer als wrapLineLength ist:

<div [isWrapped]="false" [attributesAligned]="false"></div>

<really-long-angular-component-that-would-force-wrapping class="wrapped"
                                                         [isWrapped]="true"
                                                         [attributesAligned]="true">

Fast 5 oder 6 Themen gesurft, bei denen sich die Leute auf die Implementierung dieser Funktion freuen. Da dies nicht der Fall ist, wäre es großartig, dies in vscode mit if Wrap-Anforderungen und Force-Alignment für diese entsprechende Zeile vs.

😞.

@kaankucukx Nicht sicher, was du meinst? Wird es in den vorherigen Beispielen behandelt?

+1 dafür, ich habe derzeit die besten Ergebnisse mit force für Lenker, aber es führt immer noch zu unerwünschter Umhüllung innerhalb meines Lenkerblocks:

   </label>
     {{#artdeco-hoverable-trigger placement="right"
      as
      |card|}}

und

  <ul class="text-ad-edit-panel__dropdown-list">
    {{#each yourCompanyPageTypes
      as
      |companyPageType
      index|}}

Ich muss nur die Zeilenumbrüche von Attributen mit manuellen Zeilenumbrüchen beibehalten, aber den richtigen Einzug erhalten.

FWIW funktioniert dies in keinem Editor, den ich gefunden habe, außer in Intellij. Würde das aber gerne umgesetzt sehen!

FWIW funktioniert dies in keinem Editor, den ich gefunden habe, außer in Intellij. Würde das aber gerne umgesetzt sehen!

Funktioniert auch in Netbeans.

FWIW kann dies in VSCode nicht zum Laufen bringen
Entwicklung mit Vue
Erweiterungen: Hübscher, Vetur
Beim Formatieren werden alle HTML-Tags und -Attribute in eine Zeile zurückgesetzt. Ich habe viele Lösungsvorschläge durchgespielt.
Wäre toll zu wissen, ob die Leute dies in einer .vue-Datei in VSCode haben

@christoferd darum geht es in dieser Ausgabe. Es funktioniert nicht. js-beautify kann die Zeilenumbrüche nicht beibehalten. Es wird immer auf eine Zeile gesetzt.

Ich verwende immer wieder WebStorm, weil sie ihren eigenen Formatierer haben und mit Zeilenumbrüchen arbeiten.

Im Zusammenhang mit #1404

Danke für die Arbeit an einem Fix @MacKLess! Ich warte gespannt auf eine Neuerscheinung, damit ich sie ausprobieren kann 😃