简体   繁体   English

如何在 VI 中整理 HTML 文件的缩进?

[英]How do I tidy up an HTML file's indentation in VI?

How do I fix the indentation of his huge html files which was all messed up?我如何修复他巨大的 html 文件的缩进,这些文件都搞砸了?

I tried the usual "gg=G command , which is what I use to fix the indentation of code files. However, it didn't seem to work right on HTML files. It simply removed all the formatting.我尝试了通常的"gg=G command ,这是我用来修复代码文件缩进的方法。但是,它似乎不适用于 HTML 文件。它只是删除了所有格式。

I also tried setting :filetype = xml , to see if tricking it into thinking this was an XML file would help but it still didn't do it.我还尝试设置:filetype = xml ,看看是否欺骗它认为这是一个 XML 文件会有所帮助,但它仍然没有做到。

There's several things that all need to be in place.有几件事都需要到位。 Just to summarize them all in one location:只是在一个位置总结它们:

Set the following option:设置以下选项:

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

Then either move the cursor to the top of the file and indent to the end: gg =G然后将光标移动到文件顶部并缩进到末尾: gg =G
Or select the desired text to indent and hit = to indent it.或者选择想要缩进的文本,然后点击=来缩进。

With filetype indent on inside my .vimrc , Vim indents HTML files quite nicely.在我的.vimrc使用filetype indent on ,Vim 可以很好地缩进 HTML 文件。

Simple example with a shiftwidth of 2: shiftwidth为 2 的简单示例:

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

The main problem using the smart indentation is that if the XML (or HTML) sits on one line as it may end up coming back from a curl request then gg=G won't do the trick.使用智能缩进的主要问题是,如果 XML(或 HTML)位于一行,因为它可能最终从 curl 请求返回,那么gg=G将无法解决问题。 Instead I have just experienced a good indentation using tidy directly called from VI:相反,我刚刚使用从 VI 直接调用的 tidy 体验了良好的缩进:

:!tidy -mi -xml -wrap 0 %

This basically tells VI to call tidy to cleanup an XML file not wrapping the lines to make them fit on the default 68 characters wide lines.这基本上告诉 VI 调用 tidy 来清理一个不包装行的 XML 文件,以使它们适合默认的 68 个字符宽的行。 I processed a large 29MB XML file and it took 5 or 6 seconds.我处理了一个 29MB 的大 XML 文件,耗时 5 或 6 秒。 I guess for an HTML file the command should therefore be:我猜对于 HTML 文件,命令应该是:

:!tidy -mi -html -wrap 0 %

As mentioned in comments, tidy is a basic tool which you could find on many base Linux / MacOS systems.正如评论中提到的, tidy是一个基本工具,您可以在许多基本的 Linux / MacOS 系统上找到它。 Here is the projet's page in case you wish you had it but don't: HTML Tidy .这是项目的页面,以防您希望拥有它但没有: HTML Tidy

As tylerl explains above, set the following:正如上面 tylerl 所解释的,设置以下内容:

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

However, note that in vim 7.4 the HTML tags html , head , body , and some others are not indented by default.但是,请注意,在 vim 7.4 中,HTML 标签htmlheadbody和其他一些默认情况下不会缩进。 This makes sense, as nearly all content in an HTML file falls under those tags.这是有道理的,因为 HTML 文件中的几乎所有内容都属于这些标签。 If you really want to, you can get those tags to be indented like so:如果你真的想要,你可以像这样缩进这些标签:

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

See " HTML indenting not working in compiled Vim 7.4, any ideas? " and " alternative html indent script " for more information.有关更多信息,请参阅“ HTML 缩进在已编译的 Vim 7.4 中不起作用,有什么想法吗? ”和“替代 html 缩进脚本”。

This is my solution that works nicely for opening "ugly" HTML in a nicely spaced way:这是我的解决方案,非常适合以良好的间隔方式打开“丑陋”的 HTML:

vim fileIn.html -c "set sw=2 | %s/>/>\r/ | execute 'normal gg=G' | set nohlsearch | g/^\\s*\$/d"
  • The sw command is because my default is 4, which is too high for HTML. sw命令是因为我的默认是4,对HTML来说太高了。
  • The next part adds a newline (Vim thinks it's a carriage return, sigh) after each element ( > ).下一部分在每个元素 ( > ) 之后添加一个换行符(Vim 认为这是一个回车,叹气)。
  • Then re-indent the entire file with = .然后用=重新缩进整个文件。
  • Then unhighlight > (since I have set hlsearch in my vimrc).然后取消突出显示> (因为我在 vimrc 中set hlsearch )。
  • Then remove all empty/whitespace-only lines (see " Vim delete blank lines " for more, also this is double-escaped because it's in the shell).然后删除所有空行/仅空白行(更多信息请参见“ Vim 删除空白行”,这也是双重转义,因为它在 shell 中)。

You can even add | wq! fileOut.html您甚至可以添加| wq! fileOut.html | wq! fileOut.html | wq! fileOut.html to the end if you don't want to enter Vim at all, but just clean up the file.如果您根本不想进入 Vim, | wq! fileOut.html最后,只需清理文件即可。

I use this script: https://github.com/maksimr/vim-jsbeautify我使用这个脚本: https : //github.com/maksimr/vim-jsbeautify

In the above link you have all the info:在上面的链接中,您拥有所有信息:

  1. Install安装
  2. Configure (copy from the first example)配置(从第一个示例复制)
  3. Run :call HtmlBeautify()运行:call HtmlBeautify()

Does the job beautifully!干得漂亮!

None of the answers worked for me because all my HTML was in a single line.没有一个答案对我有用,因为我所有的 HTML 都在一行中。

Basically you need first to break each line with the following command that substitutes >< with the same characters but with a line break in the middle.基本上,您首先需要使用以下命令断开每一行,该命令将><替换为相同的字符,但中间有一个换行符。

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

Then the command然后命令

gg=G

will indent the file.将缩进文件。

Here's a heavy-weight solution that gets you indenting, plus all the HTML pretty-printing you don't necessarily want to care about while you're editing.这是一个重量级的解决方案,可以让您缩进,以及您在编辑时不一定要关心的所有 HTML 漂亮打印。

First, download Tidy .首先,下载Tidy Make sure you add the binary to your path, so you can call it from any location.确保将二进制文件添加到您的路径中,以便您可以从任何位置调用它。

Next, create a config file describing your favorite HTML flavor.接下来,创建一个描述您最喜欢的 HTML 风格的配置文件。 Documentation is not great for Tidy, but here's an overview , and a list of all the options .文档对 Tidy 来说不是很好,但这里有一个概述所有选项的列表。 Here's my config file:这是我的配置文件:

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

Save this as tidyrc_html.txt in your ftplugin folder (under vimfiles).将其另存为tidyrc_html.txt在您的ftplugin文件夹中(在 vimfiles 下)。

One more file: add the following line to (or create) html.vim , also in ftplugin :另一个文件: html.vim添加到(或创建) html.vim ,也在ftplugin

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

To use it, just open an HTML file, and type /tidy .要使用它,只需打开一个 HTML 文件,然后输入/tidy (That / is the <leader> key.) (那个/<leader>键。)

There you go!你去吧! Not a quick solution, by any means, but now you're a bit better equipped for editing those huge, messed-up HTML files.无论如何,这不是一个快速的解决方案,但现在您可以更好地编辑那些巨大的、混乱的 HTML 文件。

Have you tried using the HTML indentation script on the Vim site?您是否尝试过在 Vim 站点上使用 HTML 缩进脚本?

You can integrate both tidy and html-beautify automatically by installing the plugin vim-autoformat .您可以通过安装插件vim-autoformat自动集成tidyhtml-beautify After that, you can execute whichever formatter is installed with a single keystroke.之后,您可以通过一次击键执行安装的任何格式化程序。

I tried the usual "gg=G" command, which is what I use to fix the indentation of code files.我尝试了常用的“gg=G”命令,这是我用来修复代码文件缩进的。 However, it didn't seem to work right on HTML files.但是,它似乎不适用于 HTML 文件。 It simply removed all the formatting.它只是删除了所有格式。

If vim's autoformat/indent gg=G seems to be "broken" (such as left indenting every line), most likely the indent plugin is not enabled/loaded.如果 vim 的 autoformat/indent gg=G似乎“损坏”(例如每行左缩进),则很可能未启用/加载缩进插件。 It should really give an error message instead of just doing bad indenting, otherwise users just think the autoformat/indenting feature is awful, when it actually is pretty good.它真的应该给出错误消息,而不是仅仅做不好的缩进,否则用户只会认为自动格式化/缩进功能很糟糕,而实际上它非常好。

To check if the indent plugin is enabled/loaded, run :scriptnames .要检查缩进插件是否已启用/加载,请运行:scriptnames See if .../indent/html.vim is in the list.查看.../indent/html.vim是否在列表中。 If not, then that means the plugin is not loaded.如果没有,则表示未加载插件。 In that case, add this line to ~/.vimrc :在这种情况下,将此行添加到~/.vimrc

filetype plugin indent on

Now if you open the file and run :scriptnames , you should see .../indent/html.vim .现在,如果您打开文件并运行:scriptnames ,您应该会看到.../indent/html.vim Then run gg=G , which should do the correct autoformat/indent now.然后运行gg=G ,它现在应该执行正确的自动格式化/缩进。 (Although it won't add newlines, so if all the html code is on a single line, it won't be indented). (虽然它不会添加换行符,所以如果所有的 html 代码都在一行上,它就不会缩进)。

Note: if you are running :filetype plugin indent on on the vim command line instead of ~/.vimrc , you must re-open the file :e .注意:如果你在 vim 命令行上运行:filetype plugin indent on而不是~/.vimrc ,你必须重新打开文件:e

Also, you don't need to worry about autoindent and smartindent settings, they are not relevant for this.此外,您无需担心autoindentsmartindent设置,它们与此无关。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM