Gibt es eine Funktion zum automatischen Einrücken von HTML-Code oder ein Plugin für Sublime Text (alias prettify / verschönern / formatieren)?

44368
mehas

Zum Beispiel etwas zu ändern:

<section><article><h1></h1><p></p></article></section> 

zu:

<section> <article> <h1></h1> <p></p> </article> </section> 

... das funktioniert auf ganzen Seiten und Snippets.

  • Die eingebaute Edit > Line > ReindentEinstellung macht dies nicht
  • Das Plugin HTMLTidy fügt headund bodyTags hinzu, daher funktioniert es nicht für Partials, es hat auch verschiedene andere Probleme
  • Das Plugin-Tag hat verschiedene Probleme, genug, dass es im Wesentlichen nicht funktioniert
  • Das Plugin HTMLPrettify hat verschiedene Probleme, erfordert node.js und wurde seit Monaten nicht aktualisiert
  • gist.github.com/mcdonc/3898894 gibt an, dies zu tun, erfordert jedoch Emacs

(Notepad ++ hatte Auto-Indent, Dreamweaver hatte Quellformatierung anwenden, Aptana hat Format usw.)

Das Tag-Plugin verarbeitet Inline-Tags falsch, z. B. wenn es für dieses Snippet verwendet wird:

<p>foo<a>bar<span>baz<span>qux</span></span></a></p>

Ergebnisse in:

<p> foo <a> bar <span> baz <span>qux</span> </span> </a> </p> 
23
Was ist die Frage? Aus Ihrem Beitrag ist nicht klar, was die Frage ist. Brad Patton vor 11 Jahren 0
Bearbeiteter Titel, um befragt zu werden. Ich versuche einen Weg zu finden, HTML in Sublime Text automatisch einzurücken. mehas vor 11 Jahren 0
Siehe auch [Formatieren von HTML-Code mit Sublime Text 2] (http://stackoverflow.com/questions/8839753/formatting-html-code-using-sublime-text-2). Karan vor 11 Jahren 0
Danke, ich habe jede Lösung in diesem Thread ausprobiert, keine davon funktioniert. Ich habe die Gründe aufgelistet, warum viele von ihnen in diesem Thread nicht funktionieren. mehas vor 11 Jahren 0
Ich denke, das ist die beste Arbeitslösung: http://jsbeautifier.org/ Ich hatte die gleiche Anforderung, mehrere Inline-Tags zu formatieren. Das funktioniert wirklich gut. Es erstellt auch ein geeignetes Markup für erhabenen Text, der Brocken schließen kann. Es ist auch auf der CLI unter https://www.npmjs.com/package/js-beautify verfügbar Sai krishna Deep vor 7 Jahren 0

3 Antworten auf die Frage

18
Bibhas

Das reindentfunktioniert nicht immer für Schnipsel. Sie können das TagPlugin verwenden (Installation von der Paketkontrolle). Dann drücken Sie einfach ctrl+ shift+ pund geben Sie ein tag. Sie sehen die Option Auto-Format tags on document. Wählen Sie und drücken Sie Enter. Das wird es tun

Wie ich bereits im ursprünglichen Beitrag erwähnt habe, ist das Tag-Plugin defekt, vor allem bei der Verarbeitung von Inline-Tags und anderen sehr schlechten Bugs. Der Autor hat gesagt, er müsse "das Ganze umschreiben". Das Reindent funktioniert überhaupt nicht für HTML, es korrigiert nicht die Einrückung; Tags werden lediglich an einer bestimmten Einrückungsebene ausgerichtet. mehas vor 11 Jahren 1
Nun, Tag hat für mich gearbeitet. Ich habe Ihr HTML-Snippet verwendet. Es hat einwandfrei funktioniert. Und reindent funktioniert für HTML, aber unter bestimmten Bedingungen. Bibhas vor 11 Jahren 0
Versuchen Sie es mit dem AutoFormat von Tag für dieses Snippet: `

foo bar baz qux

um zu sehen, was ich meine. Außerdem wird die Formatierung des öffnenden HTML-Tags beeinträchtigt, der in IE-bedingte Kommentare eingebettet ist, die Teil von HTML5 Boilerplate (und von Kommentaren im Allgemeinen) sind. Versuchen Sie es mit dem eingebauten `Line> Reindent` in diesem Snippet: http://jsfiddle.net/y8xXj/, um zu sehen, wie es fehlschlägt. mehas vor 11 Jahren 0
Zu Ihrer Information - Ich habe es gerade in Sublime Text 3 mit einem HTML-Snippet ausprobiert und es funktioniert wirklich! Steven vor 10 Jahren 0
Was versucht? Weder "Edit> Line> Reindent" noch das Tag-Plugin funktionierten bei diesem Snippet in ST3: "."

foo bar baz qux

` mehas vor 10 Jahren 0
Gleicher Fehler. Ich habe in der Vergangenheit unzählige Editoren verwendet, Coda, Sublime, Espresso, Chocolat, TextMate ..., aber keiner konnte Text so fehlerfrei formatieren wie Dreamweaver's Apply Source Formatierung. Zu dem die Leute einfach Tidy oder ein anderes Plugin vorschlagen, das niemals wie Dreamweaver funktioniert. Ich bin froh, dass jemand "Zooted" diese Ausgabe sieht. Leider gibt es noch keine Lösung. In Sublime Text 3 als Zooted Noted sogar mit Tag funktioniert es nicht richtig (wie in dem obigen Beispiel). Und die native Reindent-Funktion ist ziemlich wertlos. cchiera vor 10 Jahren 2
6
Jasim Mahmood

Wählen Sie Alle -> Menü Bearbeiten -> Linie -> Erneut anzeigen . Sie können eine Tastenkombination für dieselbe Verwendung festlegen .

{"keys": ["ctrl + shift + r"], "command": "reindent", "args": {"single_line": false}}

Wie ich in der Frage erwähnt habe, funktioniert das * nicht *. Probieren Sie es beim allerersten Schnipsel aus, den ich bereitgestellt habe:

mehas vor 9 Jahren 1
Funktioniert bei mir. Syntax auf HTML gesetzt? Manuel Arwed Schmidt vor 8 Jahren 0
Funktioniert nicht für mich. Derek 朕會功夫 vor 8 Jahren 2
Ja, das ist ein ziemlich guter Job, aber irgendwann fiel es in meinem Fall
`öffnende Tags.
ruffin vor 7 Jahren 0
0
Sidz

Damit die Reindent-Funktion funktioniert, müssen Sie die Option "Einrückung mit Leerzeichen" deaktivieren:

Ansicht >> Einrückung >> Einzug mit Leerzeichen

Sobald diese Option deaktiviert ist, können Sie Ihren Text und Reindent auswählen:

Bearbeiten >> Linie >> Reindent

Dies funktioniert sowohl für HTML-Syntax als auch für XML. Nicht an anderen getestet.

Ich habe eigentlich schon damit gearbeitet. Der Befehl, den Sie erwähnt haben, tut absolut nichts zu diesem Snippet in ST3: `

foobar baz

` mehas vor 7 Jahren 0