VI에서 HTML 파일의 들여 쓰기를 어떻게 정리합니까?


130

모두 엉망인 그의 거대한 HTML 파일의 들여 쓰기를 어떻게 수정합니까?

코드 파일의 들여 쓰기를 수정하는 데 사용 하는 일반적인 "gg=G명령을 시도했습니다 . 그러나 HTML 파일에서는 제대로 작동하지 않는 것 같습니다. 단순히 모든 서식을 제거했습니다.

나는 또한 :filetype = xml이것이 XML 파일이라고 생각하도록 속이는 것이 도움이 될지 알기 위해 설정을 시도 했지만 여전히 그것을하지 않았다.

답변:


91

함께 filetype indent on안에 내 .vimrc, 빔 들여 쓰기 HTML은 아주 잘 파일.

shiftwidth가 2 인 간단한 예 :

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

15
이 질문 페이지의 html을 html 파일에 붙여 넣습니다. VIM으로 열고 "set smartindent"를 입력 한 다음 "gg = G"를 입력하면 파일의 들여 쓰기가 수정되지 않습니다.
mmcdole

15
그것은 나를 위해 작동합니다. ft = html <cr> set si <cr> gg = G <cr>를 설정하십시오. 이 페이지를 아주 잘 형식화합니다.
Don Reba

5
+1은 "filetype indent on / off"가 마법을 켜거나 끄는 것을 확인했습니다.
Wim Coenen

4
예, smart indent, filetype = html 및 filetype ident를 설정하면 나에게 도움이되었습니다.
mmcdole

22
에서 chovy.com/web-development/fix-indentation-and-tabs-in-vim 에 파일 형식 들여 쓰기 한 후 E : 내가 가진 파일을 다시로드하는 데 필요한 것을 발견했다.
Marc Stober 1

189

모두 제자리에 있어야 할 것이 몇 가지 있습니다. 한 곳에서 모두 요약하면 다음과 같습니다.

다음 옵션을 설정하십시오.

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

그런 다음 커서를 파일의 상단으로 이동하고 끝까지 들여 쓰기 gg =G
하십시오 . 또는 들여 쓰기를 원하는 텍스트를 선택하고 들여 쓰기를 누르 =십시오.


@tyrel, 고마워,하지만 나를 위해 작동하지 않습니다 .. 이것은 파일의 내용입니다 : pastebin.com/gagia8W2 . 파일은이라고 home.html합니다. .php 파일을 들여 쓰는 데 아무런 문제가 없습니다. 여기에 내 .vimrc가 있습니다 : pastebin.com/FAJ0MCA9
ziiweb

1
.vimrc에서 이것을 설정할 수있는 방법이 있습니까? HTML 파일을 HTML 파일로 열 때마다 알리고 싶지 않습니다. gg, =, G 단축키에 감사드립니다. 정말 편리합니다.
zakishaheen

1
에주의 vim 7.4기본 들여 쓰기 설정이됩니다 실패 ,이 예를 들어 html, body그리고 p기본적으로 들여 쓰기되지 않습니다. 이 답변을 참조하십시오 .
코리 클라인

2
smartindent필요하지 않습니다. 또한 C 및 C ++에 맞게 조정되었으므로 autoindent대신 더 일반적인 것을 선호합니다 .
Kos

vim7.4와 잘 작동합니다. @tylerl 7.4의 html 파일에 대해이 구성을 영구적으로 만드는 방법이 있습니까?
xaph

62

스마트 들여 쓰기를 사용하는 주된 문제는 XML (또는 HTML)이 한 줄에 앉아 있으면 컬 요청에서 돌아올 gg=G수 있으며 트릭을 수행하지 않는다는 것입니다. 대신 저는 VI에서 직접 호출 한 깔끔한 방법을 사용하여 들여 쓰기를 잘했습니다.

:!tidy -mi -xml -wrap 0 %

이것은 기본적으로 VI를 깔끔하게 호출하여 줄을 줄 바꿈하지 않은 XML 파일을 정리하여 기본 68 자 너비 줄에 맞도록합니다. 큰 29MB XML 파일을 처리했으며 5 초 또는 6 초가 걸렸습니다. HTML 파일의 경우 명령은 다음과 같아야합니다.

:!tidy -mi -html -wrap 0 %

주석에서 언급했듯이 tidy많은 기본 Linux / MacOS 시스템에서 찾을 수있는 기본 도구입니다. 다음은 원하는 경우에 대비하여 프로젝트 페이지입니다. HTML Tidy .


1
기본적으로 html로 설정되어 있기 때문에 html이 필요하다고 생각하지 않습니다
lsiebert

4
@Isieber와 합의했습니다. 그러나 논리를 이해하기가 더 쉬워지고 일부 사람들은 모범 사례로 간주 될 수 있다고 생각합니다.
oscaroscar

2
참고로 HTML에 SVG (예 : 차트 등)가 포함되어 있으면 깔끔하게 질식합니다.
Alex Quinn

1
예, html 코드가 한 줄에 있으면 vim indent 명령이 작동하지 않습니다!
wisbucky 2016 년

사전에 포함 된 단어 이외의 단어는 무엇입니까? 이것은 프로젝트에 연결되지 않은 완전한 답변이 아닙니다.
Bruno Bronosky

49

tylerl이 위에서 설명했듯이 다음을 설정하십시오.

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

그러나 참고 정력 7.4 HTML 태그에 있음을 html, head, body, 일부 다른 사람이되어 있지 기본적으로 들여 쓰기. HTML 파일의 거의 모든 내용이 해당 태그에 속하기 때문에 이치에 맞습니다. 정말로 원한다면 태그를 들여 쓰기 할 수 있습니다.

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

자세한 내용은 " 컴파일 된 Vim 7.4에서 HTML 들여 쓰기가 작동하지 않습니다. "및 " 대체 html 들여 쓰기 스크립트 "를 참조하십시오.


이것은 내 책의 승자입니다! Windows에서 Vim 7.4를 사용하면 환상적으로 작동합니다! : D
Michael J

12

이것은 "간편한"HTML을 깔끔한 간격으로 여는 데 잘 작동하는 솔루션입니다.

vim fileIn.html -c "set sw=2 | %s/>/>\r/ | execute 'normal gg=G' | set nohlsearch | g/^\\s*\$/d"
  • sw내 기본은 HTML에 대한 너무 높은 인 4 있기 때문에 명령입니다.
  • 다음 부분은 각 요소 ( >) 뒤에 줄 바꿈 (Vim은 캐리지 리턴이라고 생각합니다 )을 추가합니다.
  • 그런 다음로 전체 파일을 다시 들여 씁니다 =.
  • 그런 다음 강조 표시를 해제하십시오 >( set hlsearch내 vimrc에 있기 때문에 ).
  • 그런 다음 빈 / 공백 전용 행을 모두 제거하십시오 (자세한 내용은 " Vim delete blank lines "을 참조하십시오. 또한 쉘에 있기 때문에 이중 이스케이프 처리됩니다).

| wq! fileOut.htmlVim을 전혀 입력하지 않고 파일을 정리하면 끝에 추가 할 수도 있습니다 .


깔끔한 솔루션! 나는 그것을 :%s/>\s*/>\r/g( g전역 대체를 위해 추가 \s*하고 후행 공백을 제거 하기 위해) 수정했다 . 또한 :%s/</\r</g열린 괄호 앞에 줄 바꿈을 추가하기 위해 추가했습니다. 그렇지 않으면 like 같은 태그 <td>foo</td><td>and 처럼 분할 foo</td>됩니다.
wisbucky 2016 년

페어 포인트, 기본적으로 전역 바꾸기가 켜져있어 솔루션에없는 이유입니다.
adam_0

7

이 스크립트를 사용합니다 : https://github.com/maksimr/vim-jsbeautify

위의 링크에는 모든 정보가 있습니다.

  1. 설치
  2. 구성 (첫 번째 예에서 복사)
  3. 운영 :call HtmlBeautify()

일을 아름답게합니까!


3
하하, 왜 노드도 존재 이상이 기능의 내장을했다 정력에 HTML을 정리하는 데 사용하는 노드 + JS 원하는 것 ... 내 마음을 놀라게 ..
mb21

4

Vim 사이트에서 HTML 들여 쓰기 스크립트를 사용해 보셨습니까?


+1, 나는 그것을 보지 못했습니다. 스크립트를 실행할 필요가 없다면 좋을 것입니다. 그러나 이것이 유일한 방법 일 것 같습니다.
mmcdole

이 스크립트는 더 이상 사용되지 않으며 vim (예 :)과 함께 최신 버전이 제공됩니다 /usr/share/vim/vim74/indent/html.vim. "2014 년 7 월 4 일 : Vim 7.4.356 이상에는이 스크립트의 자손이 포함됩니다 (공식 스크립트는 현재 Bram에 의해 유지 보수되고 대규모 변경 사항이 포함됩니다)"
wisbucky

4

다음은 들여 쓰기를 할 수있는 강력한 솔루션과 편집하는 동안 신경 쓰지 않아도되는 모든 HTML 인쇄 기능입니다.

먼저 Tidy를 다운로드하십시오 . 바이너리를 경로에 추가해야하므로 어느 위치에서나 바이너리를 호출 할 수 있습니다.

다음으로 선호하는 HTML 버전을 설명하는 구성 파일을 만듭니다. Tidy에는 문서가 적합하지 않지만 다음은 개요모든 옵션 목록입니다 . 내 구성 파일은 다음과 같습니다.

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

이것을 vimfiles 아래 tidyrc_html.txtftplugin폴더 에 저장하십시오 .

또 하나 개의 파일 :에 다음 줄을 추가 (또는 생성) html.vim도, ftplugin:

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

사용하려면 HTML 파일을 열고을 입력하십시오 /tidy. (즉, /는 IS <leader>키).

당신은 간다! 빠른 솔루션은 아니지만, 이제 엉망인 거대한 HTML 파일을 편집하는 데 약간 더 적합합니다.



0

코드 파일의 들여 쓰기를 수정하는 데 사용하는 일반적인 "gg = G"명령을 시도했습니다. 그러나 HTML 파일에서는 제대로 작동하지 않는 것 같습니다. 단순히 모든 서식을 제거했습니다.

vim의 자동 서식 / 들여 쓰기 gg=G가 "깨진"것처럼 보이면 (예 : 모든 줄 들여 쓰기) 왼쪽 들여 쓰기 플러그인이 활성화 /로드되지 않았을 가능성이 높습니다. 실제로 들여 쓰기를 잘못하는 대신 오류 메시지를 표시해야합니다. 그렇지 않으면 사용자는 자동 형식 / 들여 쓰기 기능이 실제로 꽤 좋을 때 끔찍하다고 생각합니다.

들여 쓰기 플러그인이 활성화 /로드되었는지 확인하려면을 실행하십시오 :scriptnames. .../indent/html.vim이 목록에 있는지 확인하십시오 . 그렇지 않은 경우 플러그인이로드되지 않았 음을 의미합니다. 이 경우이 줄을 ~/.vimrc다음에 추가하십시오 .

filetype plugin indent on

이제 파일을 열고 실행 :scriptnames하면 다음 과 같이 표시 .../indent/html.vim됩니다. 그런 다음을 실행 gg=G하십시오. 이제 올바른 자동 형식 / 들여 쓰기를해야합니다. 줄 바꿈을 추가하지는 않지만 모든 HTML 코드가 한 줄에 있으면 들여 쓰기되지 않습니다.

참고 : :filetype plugin indent on대신 vim 명령 줄에서 실행중인 경우 ~/.vimrc파일을 다시 열어야합니다.:e .

또한 걱정할 필요가 없으며 설정 autoindentsmartindent관련이 없습니다.

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.