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

mmc*_*ole 123 html vi vim indentation

如何修复他的巨大html文件的缩进,这些文件都搞砸了?

我尝试了通常的"gg = G"命令,这是我用来修复代码文件缩进的命令.但是,它似乎不适用于HTML文件.它只是删除了所有格式.

我也试过设置"gg=G,看看是否欺骗它认为这是一个XML文件会有所帮助,但它仍然没有做到.

tyl*_*erl 174

有几件事都需要到位.只是在一个位置总结它们:

设置以下选项:

:filetype indent on
:set filetype=html           # abbrev -  :set ft=html
:set smartindent             # abbrev -  :set si
Run Code Online (Sandbox Code Playgroud)

然后将光标移动到文件的顶部并缩进到结尾:gg =G
或者选择要缩进的所需文本,然后单击=以缩进.

  • `smartindent` 不是必需的。它也针对 C 和 C++ 进行了调整,我更喜欢使用更通用的 `autoindent` 来代替。 (2认同)

mar*_*cog 90

随着filetype indent on里面我的.vimrc,Vim的缩进HTML文件相当不错.

2的简单示例shiftwidth:

<html>
  <body>
    <p>
    text
    </p>
  </body>
</html>
Run Code Online (Sandbox Code Playgroud)

  • 来自http://www.chovy.com/web-development/fix-indentation-and-tabs-in-vim/发现我需要在文件类型缩进后使用:e重新加载文件. (21认同)
  • 这个对我有用.set ft = html <cr> set si <cr> gg = G <cr>.格式化这页很好. (15认同)
  • 复制将此问题页面的html粘贴到html文件中.使用VIM打开,键入"set smartindent",然后键入"gg = G",它不会修复文件的缩进. (14认同)
  • +1验证"文件类型缩进开/关"可以打开或关闭魔术. (5认同)
  • 是的,设置智能缩进后,filetype = html和filetype ident就可以了. (4认同)
  • 请注意,在`vim 7.4`中,默认缩进设置将为此示例**失败**,因为`html`,`body`和`p`默认情况下不缩进.见[本回答](http://stackoverflow.com/a/19351416/446554). (2认同)

osc*_*car 55

使用智能缩进的主要问题是,如果XML(或HTML)位于一行,因为它最终可能会从curl请求返回,那么gg=G就不会这样做了.相反,我刚刚使用从VI直接调用的整理经历了一个很好的缩进:

:!tidy -mi -xml -wrap 0 %
Run Code Online (Sandbox Code Playgroud)

这基本上告诉VI调用整理来清理一个XML文件而不是包装行以使它们适合默认的68个字符宽的行.我处理了一个大的29MB XML文件,花了5或6秒钟.我猜对于HTML文件,命令应该是:

:!tidy -mi -html -wrap 0 %
Run Code Online (Sandbox Code Playgroud)

正如评论中所提到的,这tidy是一个基本工具,您可以在许多基础Linux/MacOS系统上找到它.这是projet的页面,如果您希望拥有它,但不要:HTML Tidy.

希望这可以帮助.

  • 同意@Isieber.但是,我想这会让人更容易理解逻辑,有些人甚至可能认为这是一种很好的做法. (3认同)
  • 仅供参考,如果 HTML 包含 SVG(例如图表等),那么整洁就会窒息。 (2认同)
  • @BrunoBronosky我评论了我的答案,你提出了你的观点:) (2认同)

Cor*_*ein 48

正如tylerl上面解释的那样,设置以下内容:

:filetype indent on
:set filetype=html
:set smartindent
Run Code Online (Sandbox Code Playgroud)

然而!

需要注意的是在VIM 7.4 html标签html,head,body,和其他一些人都不会默认缩进.这是有道理的,因为html文件中的几乎所有内容都属于这些标记.如果你真的想,你可以让这些标签缩进,如下所示:

:let g:html_indent_inctags = "html,body,head,tbody" 
Run Code Online (Sandbox Code Playgroud)

有关更多信息,请参见此处此处.


ada*_*m_0 12

这是我的解决方案,适用于以一个很好的间隔方式打开"丑陋"的HTML:

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

sw命令是因为我的默认值是4,这对于HTML来说太高了.

下一部分在每个元素(>)之后添加换行符(Vim认为它是一个回车,叹息)

然后使用重新缩进整个文件 =

然后unhighlight >(因为我set hlsearch在我的vimrc中)

然后删除所有空的/仅空白行(请参阅此处了解更多信息,这也是双重转义,因为它在shell中)

| wq! fileOut.html如果你根本不想进入Vim,你甚至可以添加到最后,但只需清理文件即可.


Sim*_*onW 6

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

在上面的链接中,您拥有所有信息:

  1. 安装
  2. 配置(从第一个示例复制)
  3. :call HtmlBeautify()

工作做得很漂亮!

  • 注意:这需要nodejs和https://www.npmjs.org/package/js-beautify (3认同)
  • 哈哈,为什么你要使用node + js来清理vim中的html,这个内置的功能比节点更长,甚至存在......让我大吃一惊...... (3认同)

Tho*_* G. 6

没有一个答案对我有用,因为我所有的 HTML 都在一行中。

基本上,您首先需要使用以下命令来分隔每一行,该命令替换><为相同的字符,但中间有一个换行符。

:%s/></>\r</g
Run Code Online (Sandbox Code Playgroud)

然后命令

gg=G
Run Code Online (Sandbox Code Playgroud)

将缩进文件。


Lem*_*mur 5

这是一个重量级的解决方案,可以让您缩进,再加上您在编辑时不一定要关心的所有 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
Run Code Online (Sandbox Code Playgroud)

将其保存tidyrc_html.txt在您的ftplugin文件夹中(位于 vimfiles 下)。

又一个文件:将以下行添加到(或创建)html.vim,也在ftplugin

map <leader>tidy :%! tidy -config ~/vimfiles/ftplugin/tidyrc_html.txt <CR>
Run Code Online (Sandbox Code Playgroud)

要使用它,只需打开一个 HTML 文件,然后输入/tidy. (这/<leader>关键。)

就这样吧!无论如何,这都不是一个快速的解决方案,但现在您已经可以更好地编辑那些巨大的、混乱的 HTML 文件了。