Czy istnieje funkcja automatycznego wcięcia HTML lub wtyczka do Sublime Text (aka prettify / beautify / format)?

Na przykład coś do zmiany:

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

do:

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

... która działa na pełnych stronach i fragmentach.

Wbudowane Edit > Line > Reindentustawienie tego nie robi
Wtyczka HTMLTidy dodaje headi bodytagi, więc nie działa na częściowe, ma też inne problemy
Tag wtyczki ma różne problemy , na tyle, że zasadniczo nie działa
Wtyczka HTMLPrettify ma różne problemy , wymaga node.js i nie była aktualizowana od miesięcy
gist.github.com/mcdonc/3898894 twierdzi, że to robi, ale wymaga Emacsa

(Notepad ++ miał automatyczne wcięcie, Dreamweaver miał Zastosuj formatowanie źródła, Aptana ma Format itp.)

Wtyczka Tag niepoprawnie obsługuje tagi wbudowane , na przykład używając go w tym fragmencie:

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

prowadzi do:

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

html sublime-text-2 autoindent

— użytkownik110241
źródło

Jakie jest pytanie? Pytanie nie zawiera jednoznacznego pytania.

— Brad Patton,

Zmodyfikowany tytuł, aby był pytający. Próbuję znaleźć sposób na automatyczne wcięcie HTML w Sublime Text.

— user110241,

Zobacz także Formatowanie kodu HTML za pomocą Sublime Text 2 .

— Karan,

Dzięki, próbowałem każdego rozwiązania w tym wątku, żadne z nich nie działa. Wymieniłem powody, dla których wiele z nich nie działa w tym wątku.

— user110241,

Myślę, że to najlepsze działające rozwiązanie: jsbeautifier.org Miałem takie same wymagania dotyczące formatowania wielu tagów wbudowanych. Ten działa naprawdę dobrze. Tworzy również odpowiedni znacznik dla wysublimowanego tekstu, który może zamykać fragmenty. Jest również dostępny na CLI jako npmjs.com/package/js-beautify

— Sai krishna Deep

Odpowiedzi:

reindentNie zawsze działa dla rozszerzonych. Możesz użyć Tagwtyczki (zainstaluj z kontroli pakietu). Następnie naciśnij ctrl+ shift+ pi wpisz tag. Zobaczysz opcję Auto-Format tags on document. Wybierz i naciśnij Enter. To załatwi sprawę.

— Bibhas
źródło

Jak wspomniałem w oryginalnym poście, wtyczka Tag jest zepsuta, szczególnie w zakresie obsługi tagów wbudowanych i innych bardzo złych błędów. Autor powiedział, że musi „przepisać całość”. Reindent nie działa tak naprawdę dla HTML, nie koryguje wcięć; po prostu wyrównuje tagi do określonego poziomu wcięcia.

— user110241 17.03.13

cóż, Tag pracował dla mnie. Użyłem twojego fragmentu HTML. Działa bezbłędnie. I reindent działa dla HTML, ale pod pewnymi warunkami.

— Bibhas,

spróbuj użyć automatycznego formatowania tagu w tym fragmencie: <p>foo<a>bar<span>baz<span>qux</span></span></a></p>aby zobaczyć, co mam na myśli. Zmienia również formatowanie otwierającego znacznika HTML owiniętego w komentarzach warunkowych IE, które są częścią Boilerplate HTML5 (i ogólnie komentarze). Spróbuj użyć wbudowanego Line > Reindenttego fragmentu: jsfiddle.net/y8xXj, aby zobaczyć, jak się nie udaje.

— user110241,

Do Twojej wiadomości - Właśnie wypróbowałem w Sublime Text 3 z fragmentem HTML i naprawdę działa!

— Steven

Ten sam problem. W przeszłości używałem niezliczonych edytorów, Coda, Sublime, Espresso, Chocolat, TextMate ... ale żaden z nich nigdy nie był w stanie poprawnie sformatować tekstu, tak jak Dreamweaver's Apply Source Formatting. Do których ludzie po prostu sugerują Tidy lub inną wtyczkę, która nigdy nie działa jak Dreamweaver. Cieszę się, że ktoś „Zooted” widzi ten problem. Szkoda, że wciąż nie ma rozwiązania. W Sublime Text 3 jako Zooted Noted nawet z tagiem nie działa poprawnie (jak w jego powyższym przykładzie). A natywna funkcja Reindent jest dość bezwartościowa.

— cchiera

Wybierz Wszystkie -> Edytuj menu -> Linia -> Reindend zrobi. Możesz ustawić kombinację skrótów dla tego samego zastosowania.

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

— Jasim Mahmood
źródło

Jak wspomniałem w pytaniu, to nie działa. Wypróbuj go na pierwszym fragmencie, który podałem: <section><article><h1></h1><p></p></article> </section>

— user110241

Pracuje dla mnie. Składnia ustawiona na HTML?

— Manuel Arwed Schmidt

Nie działa dla mnie.

— Derek 朕會功夫

Tak, robi całkiem niezłą robotę, ale ostatecznie zaczął spadać, w moim przypadku <div>otwieranie tagów.

— ruffin

Aby funkcja Reindent działała, musisz odznaczyć opcję „Wcięcie za pomocą spacji”:

Zobacz >> Wcięcie >> Wcięcie Korzystanie ze spacji

Po odznaczeniu tej opcji możesz zaznaczyć swój tekst i Reindent:

Edytuj >> Linia >> Reindent

Będzie to działać zarówno w przypadku składni HTML, jak i XML. Nie testowałem tego na żadnym innym.

— Sidz
źródło

Właściwie już z tym działałem niezaznaczony. Polecenie, o którym wspomniałeś, nie ma absolutnie nic wspólnego z tym fragmentem <html><head></head><body><div><p>foobar<span>baz</span></p></div></body></html>

— kodu