Jak uporządkować wcięcia pliku HTML w VI?

Question 1

Jak naprawić wcięcia w jego ogromnych plikach HTML, które były pomieszane?

Wypróbowałem zwykłe "gg=Gpolecenie , którego używam, aby naprawić wcięcia plików kodu. Jednak wydawało się, że nie działa dobrze na plikach HTML. Po prostu usunął całe formatowanie.

Próbowałem też ustawić :filetype = xml, aby zobaczyć, czy oszukanie go w myśleniu, że to plik XML, pomogłoby, ale nadal tego nie robi.

Question 2

Z filetype indent onwewnątrz mojego .vimrcVim wcięcia html całkiem ładnie.

Prosty przykład z shiftwidth2:

<html>
  <body>
    <p>
    text
    </p>
  </body>
</html>

Question 3

Jest kilka rzeczy, które muszą być gotowe. Podsumowując je wszystkie w jednym miejscu:

Ustaw następującą opcję:

:filetype indent on
:set filetype=html           # abbrev -  :set ft=html
:set smartindent             # abbrev -  :set si

Następnie albo przesuń kursor na górę pliku i wykonaj wcięcie do końca: gg =G
Lub wybierz żądany tekst do wcięcia i naciśnij, =aby go wciąć.

Question 4

Głównym problemem związanym z inteligentnym wcięciem jest to, że jeśli XML (lub HTML) znajduje się w jednej linii, ponieważ może w końcu wrócić z żądania curl, to gg=Gnie zadziała. Zamiast tego właśnie doświadczyłem dobrego wcięcia przy użyciu tidy wywołanego bezpośrednio z VI:

:!tidy -mi -xml -wrap 0 %

Zasadniczo mówi to VI, aby wywoływał tidy w celu wyczyszczenia pliku XML bez zawijania wierszy w celu dopasowania ich do domyślnych linii o szerokości 68 znaków. Przetworzyłem duży plik XML o wielkości 29 MB i zajęło to 5 lub 6 sekund. Domyślam się, że dla pliku HTML polecenie powinno wyglądać następująco:

:!tidy -mi -html -wrap 0 %

Jak wspomniano w komentarzach, tidyjest to podstawowe narzędzie, które można znaleźć w wielu podstawowych systemach Linux / MacOS. Oto strona projektu na wypadek, gdybyś chciał, ale nie masz: HTML Tidy .

Question 5

Jak Tylerl wyjaśnia powyżej, ustaw następujące elementy:

:filetype indent on
:set filetype=html
:set smartindent

Jednak należy pamiętać, że w vim 7.4 znaczniki HTML html, head, body, i niektórzy inni nie wcięty domyślnie. Ma to sens, ponieważ prawie cała zawartość pliku HTML podlega tym znacznikom. Jeśli naprawdę chcesz, możesz ustawić wcięcia tych tagów w następujący sposób:

:let g:html_indent_inctags = "html,body,head,tbody"

Zobacz „ Wcięcia HTML nie działają w skompilowanym Vimie 7.4, jakieś pomysły? ” I „ alternatywny skrypt wcięć HTML ”, aby uzyskać więcej informacji.

Question 6

Oto moje rozwiązanie, które dobrze sprawdza się przy otwieraniu „brzydkiego” HTML-a w ładnie rozmieszczony sposób:

vim fileIn.html -c "set sw=2 | %s/>/>\r/ | execute 'normal gg=G' | set nohlsearch | g/^\\s*\$/d"

To swpolecenie jest spowodowane tym, że moja domyślna wartość to 4, co jest zbyt wysokie dla HTML.
Następna część dodaje nową linię (Vim myśli, że to powrót karetki, westchnienie) po każdym elemencie ( >).
Następnie wprowadź ponownie wcięcie całego pliku za pomocą =.
Następnie odznacz >(ponieważ mam set hlsearchw moim vimrc).
Następnie usuń wszystkie puste / tylko białe znaki (zobacz " Vim usuwa puste linie ", aby uzyskać więcej informacji, również jest to znak podwójnego znaku ucieczki, ponieważ znajduje się w powłoce).

Możesz nawet dodać | wq! fileOut.htmlna końcu, jeśli w ogóle nie chcesz wchodzić do Vima, ale po prostu wyczyść plik.

Question 7

Używam tego skryptu: https://github.com/maksimr/vim-jsbeautify

W powyższym linku masz wszystkie informacje:

zainstalować
Skonfiguruj (skopiuj z pierwszego przykładu)
Biegać :call HtmlBeautify()

Wykonuje swoją pracę pięknie!

Question 8

Czy próbowałeś użyć skryptu wcięć HTML na stronie Vim?

http://www.vim.org/scripts/script.php?script_id=2075

Question 9

Oto ciężkie rozwiązanie, które umożliwia tworzenie wcięć, a także wszystkie ładne wydruki HTML, o które niekoniecznie chcesz się przejmować podczas edycji.

Najpierw pobierz Tidy . Upewnij się, że dodałeś plik binarny do swojej ścieżki, abyś mógł wywoływać go z dowolnego miejsca.

Następnie utwórz plik konfiguracyjny opisujący Twój ulubiony smak HTML. Dokumentacja nie jest świetna dla Tidy, ale oto przegląd i lista wszystkich opcji . Oto mój plik konfiguracyjny:

bare: yes
break-before-br: no
clean: yes
drop-proprietary-attributes: yes
fix-uri: yes
indent-spaces: 4
indent: yes
logical-emphasis: yes
markup: yes
output-xhtml: yes
quiet: yes
quote-marks: yes
replace-color: yes
tab-size: 4
uppercase-tags: no
vertical-space: yes
word-2000: yes
wrap: 0

Zapisz to tidyrc_html.txtw swoim ftpluginfolderze (w vimfiles).

Jeszcze jeden plik: dodaj następujący wiersz do (lub utwórz) html.vim, również w ftplugin:

map <leader>tidy :%! tidy -config ~/vimfiles/ftplugin/tidyrc_html.txt <CR>

Aby z niego skorzystać, po prostu otwórz plik HTML i wpisz /tidy. (To /jest <leader>klucz.)

Proszę bardzo! W żadnym wypadku nie jest to szybkie rozwiązanie, ale teraz jesteś trochę lepiej przygotowany do edycji tych ogromnych, popsutych plików HTML.

Question 10

Możesz automatycznie zintegrować tidy i html-beautify , instalując wtyczkę vim-autoformat . Następnie możesz uruchomić dowolny program formatujący, który jest zainstalowany, za pomocą jednego naciśnięcia klawisza.

Question 11

Żadna z odpowiedzi nie działała dla mnie, ponieważ cały mój kod HTML znajdował się w jednej linii.

Zasadniczo musisz najpierw podzielić każdy wiersz za pomocą następującego polecenia, które zastępuje ><te same znaki, ale z podziałem wiersza pośrodku.

:%s/></>\r</g

Potem polecenie

gg=G

spowoduje wcięcie pliku.

Question 12

Wypróbowałem zwykłe polecenie „gg = G”, którego używam do naprawiania wcięć w plikach kodu. Jednak wyglądało na to, że nie działa poprawnie na plikach HTML. Po prostu usunął całe formatowanie.

Jeśli autoformatowanie / wcięcie vima gg=Gwydaje się być "zepsute" (np. Wcięcie po lewej stronie każdej linii), najprawdopodobniej wtyczka indent nie jest włączona / załadowana. Powinien naprawdę dać komunikat o błędzie zamiast po prostu robić złe wcięcia, w przeciwnym razie użytkownicy po prostu uważają, że funkcja autoformatowania / wcięć jest okropna, podczas gdy w rzeczywistości jest całkiem dobra.

Aby sprawdzić, czy wtyczka indent jest włączona / załadowana, uruchom :scriptnames. Sprawdź, czy .../indent/html.vimjest na liście. Jeśli nie, oznacza to, że wtyczka nie została załadowana. W takim przypadku dodaj tę linię do ~/.vimrc:

filetype plugin indent on

Teraz, jeśli otworzysz plik i uruchomisz :scriptnames, powinieneś zobaczyć .../indent/html.vim. Następnie uruchom gg=G, co powinno teraz wykonać poprawne autoformatowanie / wcięcie. (Chociaż nie doda nowych linii, więc jeśli cały kod html znajduje się w jednym wierszu, nie będzie wcięty).

Uwaga: jeśli :filetype plugin indent onzamiast tego korzystasz z wiersza poleceń vim ~/.vimrc, musisz ponownie otworzyć plik :e.

Nie musisz się też martwić o ustawienia autoindenti smartindentustawienia, nie są one do tego istotne.

Answer 1

Jak naprawić wcięcia w jego ogromnych plikach HTML, które były pomieszane?

Wypróbowałem zwykłe "gg=Gpolecenie , którego używam, aby naprawić wcięcia plików kodu. Jednak wydawało się, że nie działa dobrze na plikach HTML. Po prostu usunął całe formatowanie.

Próbowałem też ustawić :filetype = xml, aby zobaczyć, czy oszukanie go w myśleniu, że to plik XML, pomogłoby, ale nadal tego nie robi.

Answer 2

92

Z filetype indent onwewnątrz mojego .vimrcVim wcięcia html całkiem ładnie.

Prosty przykład z shiftwidth2:

<html>
  <body>
    <p>
    text
    </p>
  </body>
</html>

moinudin
źródło

15

Skopiuj, wklej kod HTML tej strony z pytaniami do pliku HTML. Otwórz za pomocą VIM, wpisz „set smartindent”, a następnie „gg = G” i nie naprawia to wcięcia pliku.

mmcdole

16

Mi to pasuje. set ft = html <cr> set si <cr> gg = G <cr>. Dość dobrze formatuje tę stronę.

Don Reba

5

+1 potwierdził, że „włączenie / wyłączenie wcięcia typu pliku” włącza lub wyłącza magię.

Wim Coenen

4

Tak, po ustawieniu inteligentnego wcięcia, filetype = html, a i filetype ident zadziałało.

mmcdole

22

Ze strony chovy.com/web-development/fix-indentation-and-tabs-in-vim stwierdziłem, że muszę ponownie załadować plik: e po włączeniu wcięcia typu pliku.

Marc Stober

Answer 3

15

Skopiuj, wklej kod HTML tej strony z pytaniami do pliku HTML. Otwórz za pomocą VIM, wpisz „set smartindent”, a następnie „gg = G” i nie naprawia to wcięcia pliku.

mmcdole

Answer 4

16

Mi to pasuje. set ft = html <cr> set si <cr> gg = G <cr>. Dość dobrze formatuje tę stronę.

Don Reba

Answer 5

5

+1 potwierdził, że „włączenie / wyłączenie wcięcia typu pliku” włącza lub wyłącza magię.

Wim Coenen

Answer 6

4

Tak, po ustawieniu inteligentnego wcięcia, filetype = html, a i filetype ident zadziałało.

mmcdole

Answer 7

22

Ze strony chovy.com/web-development/fix-indentation-and-tabs-in-vim stwierdziłem, że muszę ponownie załadować plik: e po włączeniu wcięcia typu pliku.

Marc Stober

Answer 8

191

Jest kilka rzeczy, które muszą być gotowe. Podsumowując je wszystkie w jednym miejscu:

Ustaw następującą opcję:

:filetype indent on
:set filetype=html           # abbrev -  :set ft=html
:set smartindent             # abbrev -  :set si

Następnie albo przesuń kursor na górę pliku i wykonaj wcięcie do końca: gg =G
Lub wybierz żądany tekst do wcięcia i naciśnij, =aby go wciąć.

tylerl
źródło

@tyrel, dzięki, ale u mnie nie działa. Oto zawartość pliku: pastebin.com/gagia8W2 . Plik nosi nazwę home.html. Nie mam problemu z wcięciem plików .php. Tutaj masz moje .vimrc: pastebin.com/FAJ0MCA9

ziiweb

1

Czy istnieje sposób, aby ustawić to w pliku .vimrc? Nie chcę mówić za każdym razem, gdy otwieram plik HTML, że jest to plik HTML. Wielkie dzięki za skrót gg, =, G. Naprawdę przydatne.

zakishaheen

1

Należy zauważyć, że w vim 7.4domyślnych ustawień wcięcia będzie nie na tym przykładzie, jak html, bodyi pnie są wcięte domyślnie. Zobacz tę odpowiedź .

Cory Klein

2

smartindentnie jest konieczne. Jest również dostrojony do C i C ++, wolę autoindentzamiast tego używać bardziej ogólnych .

Kos

Działa świetnie z vim7.4. @tylerl czy jest jakiś sposób, aby ta konfiguracja stała się trwała dla plików HTML w wersji 7.4?

xaph

Answer 9

@tyrel, dzięki, ale u mnie nie działa. Oto zawartość pliku: pastebin.com/gagia8W2 . Plik nosi nazwę home.html. Nie mam problemu z wcięciem plików .php. Tutaj masz moje .vimrc: pastebin.com/FAJ0MCA9

ziiweb

Answer 10

1

Czy istnieje sposób, aby ustawić to w pliku .vimrc? Nie chcę mówić za każdym razem, gdy otwieram plik HTML, że jest to plik HTML. Wielkie dzięki za skrót gg, =, G. Naprawdę przydatne.

zakishaheen

Answer 11

1

Należy zauważyć, że w vim 7.4domyślnych ustawień wcięcia będzie nie na tym przykładzie, jak html, bodyi pnie są wcięte domyślnie. Zobacz tę odpowiedź .

Cory Klein

Answer 12

2

smartindentnie jest konieczne. Jest również dostrojony do C i C ++, wolę autoindentzamiast tego używać bardziej ogólnych .

Kos

Answer 13

Działa świetnie z vim7.4. @tylerl czy jest jakiś sposób, aby ta konfiguracja stała się trwała dla plików HTML w wersji 7.4?

xaph

Answer 14

65

Głównym problemem związanym z inteligentnym wcięciem jest to, że jeśli XML (lub HTML) znajduje się w jednej linii, ponieważ może w końcu wrócić z żądania curl, to gg=Gnie zadziała. Zamiast tego właśnie doświadczyłem dobrego wcięcia przy użyciu tidy wywołanego bezpośrednio z VI:

:!tidy -mi -xml -wrap 0 %

Zasadniczo mówi to VI, aby wywoływał tidy w celu wyczyszczenia pliku XML bez zawijania wierszy w celu dopasowania ich do domyślnych linii o szerokości 68 znaków. Przetworzyłem duży plik XML o wielkości 29 MB i zajęło to 5 lub 6 sekund. Domyślam się, że dla pliku HTML polecenie powinno wyglądać następująco:

:!tidy -mi -html -wrap 0 %

Jak wspomniano w komentarzach, tidyjest to podstawowe narzędzie, które można znaleźć w wielu podstawowych systemach Linux / MacOS. Oto strona projektu na wypadek, gdybyś chciał, ale nie masz: HTML Tidy .

oscaroscar
źródło

1

Nie wierzę, że html jest potrzebny, ponieważ domyślnie jest to html

lsiebert,

4

Uzgodniono z tobą @Isieber. Wydaje mi się jednak, że ułatwia to zrozumienie logiki, a niektórzy mogą nawet uznać je za dobrą praktykę.

oscaroscar

2

FYI, porządne dławiki, jeśli HTML zawiera SVG (np. Wykresy itp.).

Alex Quinn

1

Tak, jeśli kod HTML jest w jednej linii, polecenie vim indent nie zadziała!

wisbucky

Czym jest porządek poza słowem w słowniku? Nie jest to pełna odpowiedź bez powiązania z projektem.

Bruno Bronosky

Answer 15

1

Nie wierzę, że html jest potrzebny, ponieważ domyślnie jest to html

lsiebert,

Answer 16

4

Uzgodniono z tobą @Isieber. Wydaje mi się jednak, że ułatwia to zrozumienie logiki, a niektórzy mogą nawet uznać je za dobrą praktykę.

oscaroscar

Answer 17

2

FYI, porządne dławiki, jeśli HTML zawiera SVG (np. Wykresy itp.).

Alex Quinn

Answer 18

1

Tak, jeśli kod HTML jest w jednej linii, polecenie vim indent nie zadziała!

wisbucky

Answer 19

Czym jest porządek poza słowem w słowniku? Nie jest to pełna odpowiedź bez powiązania z projektem.

Bruno Bronosky

Answer 20

Jak Tylerl wyjaśnia powyżej, ustaw następujące elementy:

:filetype indent on
:set filetype=html
:set smartindent

Jednak należy pamiętać, że w vim 7.4 znaczniki HTML html, head, body, i niektórzy inni nie wcięty domyślnie. Ma to sens, ponieważ prawie cała zawartość pliku HTML podlega tym znacznikom. Jeśli naprawdę chcesz, możesz ustawić wcięcia tych tagów w następujący sposób:

:let g:html_indent_inctags = "html,body,head,tbody"

Zobacz „ Wcięcia HTML nie działają w skompilowanym Vimie 7.4, jakieś pomysły? ” I „ alternatywny skrypt wcięć HTML ”, aby uzyskać więcej informacji.

Answer 21

to jest zwycięzca w mojej książce! Używanie Vima 7.4 w systemie Windows i działa fantastycznie! : D

Michael J

Answer 22

Oto moje rozwiązanie, które dobrze sprawdza się przy otwieraniu „brzydkiego” HTML-a w ładnie rozmieszczony sposób:

vim fileIn.html -c "set sw=2 | %s/>/>\r/ | execute 'normal gg=G' | set nohlsearch | g/^\\s*\$/d"

To swpolecenie jest spowodowane tym, że moja domyślna wartość to 4, co jest zbyt wysokie dla HTML.
Następna część dodaje nową linię (Vim myśli, że to powrót karetki, westchnienie) po każdym elemencie ( >).
Następnie wprowadź ponownie wcięcie całego pliku za pomocą =.
Następnie odznacz >(ponieważ mam set hlsearchw moim vimrc).
Następnie usuń wszystkie puste / tylko białe znaki (zobacz " Vim usuwa puste linie ", aby uzyskać więcej informacji, również jest to znak podwójnego znaku ucieczki, ponieważ znajduje się w powłoce).

Możesz nawet dodać | wq! fileOut.htmlna końcu, jeśli w ogóle nie chcesz wchodzić do Vima, ale po prostu wyczyść plik.

Answer 23

Zgrabne rozwiązanie! Zmodyfikowałem go na :%s/>\s*/>\r/g(dodałem a gdla globalnego zastąpienia i \s*aby usunąć końcowe białe znaki). Dodałem również, :%s/</\r</gaby dodać nową linię przed otwartym nawiasem. W przeciwnym razie tagi like <td>foo</td>zostaną podzielone jak <td>i foo</td>.

wisbucky

Answer 24

Słuszna uwaga, mam domyślnie włączoną funkcję globalnej zamiany, dlatego nie ma jej w moim rozwiązaniu.

adam_0

Answer 25

7

Używam tego skryptu: https://github.com/maksimr/vim-jsbeautify

W powyższym linku masz wszystkie informacje:

zainstalować
Skonfiguruj (skopiuj z pierwszego przykładu)
Biegać :call HtmlBeautify()

Wykonuje swoją pracę pięknie!

SimonW
źródło

3

haha, dlaczego miałbyś chcieć używać node + js do czyszczenia html w vimie, który ma tę możliwość wbudowaną dłużej niż w ogóle node istnieje ... zadziwia mój umysł ..

mb21

Answer 26

3

haha, dlaczego miałbyś chcieć używać node + js do czyszczenia html w vimie, który ma tę możliwość wbudowaną dłużej niż w ogóle node istnieje ... zadziwia mój umysł ..

mb21

Answer 27

4

Czy próbowałeś użyć skryptu wcięć HTML na stronie Vim?

http://www.vim.org/scripts/script.php?script_id=2075

JaredPar
źródło

+1, tego nie widziałem. Byłoby miło, gdybym nie musiał uruchamiać skryptu, ale wygląda na to, że może to być jedyny sposób.

mmcdole

Ten skrypt jest teraz przestarzały, a nowsza wersja zawiera vim (np /usr/share/vim/vim74/indent/html.vim.). „4 lipca 2014 r .: Vim 7.4.356 lub nowszy zawiera potomka tego skryptu (oficjalny skrypt jest teraz obsługiwany przez Brama i zawiera ogromne zmiany)”

wisbucky

Answer 28

+1, tego nie widziałem. Byłoby miło, gdybym nie musiał uruchamiać skryptu, ale wygląda na to, że może to być jedyny sposób.

mmcdole

Answer 29

Ten skrypt jest teraz przestarzały, a nowsza wersja zawiera vim (np /usr/share/vim/vim74/indent/html.vim.). „4 lipca 2014 r .: Vim 7.4.356 lub nowszy zawiera potomka tego skryptu (oficjalny skrypt jest teraz obsługiwany przez Brama i zawiera ogromne zmiany)”

wisbucky

Answer 30

Oto ciężkie rozwiązanie, które umożliwia tworzenie wcięć, a także wszystkie ładne wydruki HTML, o które niekoniecznie chcesz się przejmować podczas edycji.

Najpierw pobierz Tidy . Upewnij się, że dodałeś plik binarny do swojej ścieżki, abyś mógł wywoływać go z dowolnego miejsca.

Następnie utwórz plik konfiguracyjny opisujący Twój ulubiony smak HTML. Dokumentacja nie jest świetna dla Tidy, ale oto przegląd i lista wszystkich opcji . Oto mój plik konfiguracyjny:

bare: yes
break-before-br: no
clean: yes
drop-proprietary-attributes: yes
fix-uri: yes
indent-spaces: 4
indent: yes
logical-emphasis: yes
markup: yes
output-xhtml: yes
quiet: yes
quote-marks: yes
replace-color: yes
tab-size: 4
uppercase-tags: no
vertical-space: yes
word-2000: yes
wrap: 0

Zapisz to tidyrc_html.txtw swoim ftpluginfolderze (w vimfiles).

Jeszcze jeden plik: dodaj następujący wiersz do (lub utwórz) html.vim, również w ftplugin:

map <leader>tidy :%! tidy -config ~/vimfiles/ftplugin/tidyrc_html.txt <CR>

Aby z niego skorzystać, po prostu otwórz plik HTML i wpisz /tidy. (To /jest <leader>klucz.)

Proszę bardzo! W żadnym wypadku nie jest to szybkie rozwiązanie, ale teraz jesteś trochę lepiej przygotowany do edycji tych ogromnych, popsutych plików HTML.

Answer 31

Możesz automatycznie zintegrować tidy i html-beautify , instalując wtyczkę vim-autoformat . Następnie możesz uruchomić dowolny program formatujący, który jest zainstalowany, za pomocą jednego naciśnięcia klawisza.

Answer 32

Żadna z odpowiedzi nie działała dla mnie, ponieważ cały mój kod HTML znajdował się w jednej linii.

Zasadniczo musisz najpierw podzielić każdy wiersz za pomocą następującego polecenia, które zastępuje ><te same znaki, ale z podziałem wiersza pośrodku.

:%s/></>\r</g

Potem polecenie

gg=G

spowoduje wcięcie pliku.

Answer 33

Wypróbowałem zwykłe polecenie „gg = G”, którego używam do naprawiania wcięć w plikach kodu. Jednak wyglądało na to, że nie działa poprawnie na plikach HTML. Po prostu usunął całe formatowanie.

Jeśli autoformatowanie / wcięcie vima gg=Gwydaje się być "zepsute" (np. Wcięcie po lewej stronie każdej linii), najprawdopodobniej wtyczka indent nie jest włączona / załadowana. Powinien naprawdę dać komunikat o błędzie zamiast po prostu robić złe wcięcia, w przeciwnym razie użytkownicy po prostu uważają, że funkcja autoformatowania / wcięć jest okropna, podczas gdy w rzeczywistości jest całkiem dobra.

Aby sprawdzić, czy wtyczka indent jest włączona / załadowana, uruchom :scriptnames. Sprawdź, czy .../indent/html.vimjest na liście. Jeśli nie, oznacza to, że wtyczka nie została załadowana. W takim przypadku dodaj tę linię do ~/.vimrc:

filetype plugin indent on

Teraz, jeśli otworzysz plik i uruchomisz :scriptnames, powinieneś zobaczyć .../indent/html.vim. Następnie uruchom gg=G, co powinno teraz wykonać poprawne autoformatowanie / wcięcie. (Chociaż nie doda nowych linii, więc jeśli cały kod html znajduje się w jednym wierszu, nie będzie wcięty).

Uwaga: jeśli :filetype plugin indent onzamiast tego korzystasz z wiersza poleceń vim ~/.vimrc, musisz ponownie otworzyć plik :e.

Nie musisz się też martwić o ustawienia autoindenti smartindentustawienia, nie są one do tego istotne.

Jak uporządkować wcięcia pliku HTML w VI?

Odpowiedzi: