web-dev-qa-db-ja.com

VIでHTMLファイルのインデントを整理するにはどうすればよいですか?

混乱した彼の巨大なhtmlファイルのインデントを修正するにはどうすればよいですか?

通常の "gg = G"コマンド を試しました。これは、コードファイルのインデントを修正するために使用するものです。ただし、HTMLファイルでは正しく機能しないようです。単にすべてのフォーマットを削除しました。

私も設定してみました:filetype = xml、これをXMLファイルだと思い込ませるのに役立つかどうかを確認するのに役立ちますが、まだ実行されませんでした。

120
mmcdole

filetype indent on私の内部.vimrc、VimはHTMLファイルを非常にうまくインデントします。

shiftwidthが2の単純な例:

<html>
  <body>
    <p>
    text
    </p>
  </body>
</html>
85
marcog

すべての準備が必要なものがいくつかあります。それらをすべて1つの場所にまとめるだけです。

次のオプションを設定します。

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

次に、カーソルをファイルの最上部に移動し、最後までインデントします。gg=G
またはインデントしてヒットするテキストを選択します = インデントします。

168
tylerl

スマートインデントを使用する主な問題は、XML(またはHTML)が1行にある場合、最終的にcurlリクエストから戻ってくる可能性があるため、gg=Gはトリックを行いません。代わりに、VIから直接呼び出される整頓を使用して、ちょうど良いインデントを経験しました。

:!tidy -mi -xml -wrap 0 %

これは基本的にVIにtidyを呼び出して行をラップしないXMLファイルをクリーンアップし、デフォルトの68文字幅の行に収まるようにします。 29MBの大きなXMLファイルを処理しましたが、5〜6秒かかりました。したがって、HTMLファイルの場合、コマンドは次のようになります。

:!tidy -mi -html -wrap 0 %

コメントで述べたように、tidyは、多くのベースLinux/MacOSシステムで見つけることができる基本的なツールです。あなたがそれを持っていたいが、そうしない場合のプロジェクトのページは次のとおりです: HTML Tidy

これが役立つことを願っています。

51
oscaroscar

Tylerlが上記で説明したように、次を設定します。

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

しかしながら!

Vim 7.4では、htmlタグhtmlheadbody、および他のいくつかはnotデフォルトでインデントされます。 htmlファイル内のほぼすべてのコンテンツがこれらのタグに該当するため、これは理にかなっています。本当にしたい場合は、これらのタグを次のようにインデントさせることができます。

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

詳細については、 here および here を参照してください。

46
Cory Klein

これは、「solutionい」HTMLを適切な間隔で開くためにうまく機能する私のソリューションです。

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

swコマンドは、デフォルトが4でHTMLには高すぎるためです。

次の部分では、各要素(>)の後に改行(Vimはキャリッジリターンと思われます)を追加します

次に、=を使用してファイル全体を再度インデントします

次に、>をハイライト解除します(vimrcにset hlsearchがあるため)

次に、すべての空/空白のみの行を削除します(詳細については here を参照してください。これはシェルにあるため、二重エスケープされます)

Vimをまったく使用しないで、ファイルをクリーンアップする場合は、| wq! fileOut.htmlを最後に追加することもできます。

11
adam_0

私はこのスクリプトを使用します: https://github.com/maksimr/vim-jsbeautify

上記のリンクには、すべての情報があります。

  1. インストール
  2. 構成(最初の例からコピー)
  3. :call HtmlBeautify()を実行します

仕事を美しくします!

6
SimonW

これは、インデントを取得できるヘビーウェイトソリューションに加えて、編集中に必ずしも気にしたくないすべての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

これをftpluginフォルダー(vimfilesの下)にtidyrc_html.txtとして保存します。

もう1つのファイル:ftplugin内のhtml.vimに次の行を追加(または作成)します。

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

使用するには、HTMLファイルを開いて/tidyと入力するだけです。 (つまり、/<leader>キーです。)

行くぞ!決して迅速な解決策ではありませんが、これらの巨大で混乱したHTMLファイルを編集できるようになりました。

4
Lemur

VimサイトでHTMLインデントスクリプトを使用してみましたか?

4
JaredPar

プラグイン vim-autoformat をインストールすることにより、 tidyhtml-beautify の両方を自動的に統合できます。その後、インストールされているフォーマッタを1回のキーストロークで実行できます。

2

コードファイルのインデントを修正するために使用する通常の「gg = G」コマンドを試しました。ただし、HTMLファイルでは正しく機能しないようです。単にすべてのフォーマットを削除しました。

Vimのautoformat/indent gg=Gが "壊れている"(すべての行を左にインデントするなど)のように見える場合、インデントプラグインが有効/ロードされていない可能性があります。悪いインデントを行うだけでなく、実際にエラーメッセージを表示する必要があります。

インデントプラグインが有効/ロードされているかどうかを確認するには、:scriptnamesを実行します。 .../indent/html.vimがリストにあるかどうかを確認します。そうでない場合は、プラグインがロードされていないことを意味します。その場合、次の行を~/.vimrcに追加します。

filetype plugin indent on

ファイルを開いて:scriptnamesを実行すると、.../indent/html.vimが表示されます。次にgg=Gを実行します。これにより、正しいオートフォーマット/インデントがすぐに実行されます。 (改行は追加されませんが、すべてのhtmlコードが1行にある場合、インデントされません)。

注::filetype plugin indent onではなく~/.vimrcをvimコマンドラインで実行している場合は、ファイル:eを再度開く必要があります。

また、autoindentsmartindentの設定について心配する必要はありません。これらは関係ありません。

0
wisbucky