blocks|key|3107752|text|一种方法是将所有标签拆分为各自的行。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3107753|:s/<[%5E>]*>/\r&\r/g
:g/%5E$/d|code-block|syntax|javascript|3107754|如果你有浮动的<或>符号(例如无效的超文本标记语言，JavaScript比较运算符，CSS直接子选择器部分)，这将不能正常工作，你可以切换到类似于只做结束标记的东西-+<\/[%5E>]*>。无论如何，它提供了一个坚实的开始。|offset|length|style|CODE|3107755|Demonstration:|BOLD|3107756|有了这样一个理想化的文件，|3107757|<!DOCTYPE+html><html><head><title>hello</title></head><body>world</body></html>|3107758|这会产生这样的结果：|3107759|<!DOCTYPE+html>
<html>
<head>
<title>
hello
</title>
</head>
<body>
world
</body>
</html>|3107760|然后，=将生成您想要的内容：|3107761|<!DOCTYPE+html>
<html>
++++<head>
++++++++<title>
++++++++++++hello
++++++++</title>
++++</head>
++++<body>
++++++++world
++++</body>
</html>|3107762|entityMap^0|0|0|7|1|9|1|2C|9|0|0|E|0|0|0|0|0|3|1|0|0^^$0|@$1|2|3|4|5|6|7|13|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|14|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|15|8|@$I|16|J|17|K|L]|$I|18|J|19|K|L]|$I|1A|J|1B|K|L]]|9|@]|A|$]]|$1|M|3|N|5|6|7|1C|8|@$I|1D|J|1E|K|O]]|9|@]|A|$]]|$1|P|3|Q|5|6|7|1F|8|@]|9|@]|A|$]]|$1|R|3|S|5|D|7|1G|8|@]|9|@]|A|$E|F]]|$1|T|3|U|5|6|7|1H|8|@]|9|@]|A|$]]|$1|V|3|W|5|D|7|1I|8|@]|9|@]|A|$E|F]]|$1|X|3|Y|5|6|7|1J|8|@$I|1K|J|1L|K|L]]|9|@]|A|$]]|$1|Z|3|10|5|D|7|1M|8|@]|9|@]|A|$E|F]]|$1|11|3|-4|5|6|7|1N|8|@]|9|@]|A|$]]]|12|$]]

One way to start it is to split all tags onto their own lines.

<pre><code>:s/&lt;[^&gt;]*&gt;/\r&amp;\r/g
:g/^$/d
</code></pre>

If you have floating <code>&lt;</code> or <code>&gt;</code> symbols (e.g. invalid HTML, JavaScript comparison operators, CSS direct descendant selector part), this won't work properly and you could switch to something like just doing end tags - <code>&lt;\/[^&gt;]*&gt;</code>. It provides a solid start, anyway.

Demonstration:

With a idealised document like this,

<pre><code>&lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head&gt;&lt;title&gt;hello&lt;/title&gt;&lt;/head&gt;&lt;body&gt;world&lt;/body&gt;&lt;/html&gt;
</code></pre>

This produces this:

<pre><code>&lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;head&gt;
&lt;title&gt;
hello
&lt;/title&gt;
&lt;/head&gt;
&lt;body&gt;
world
&lt;/body&gt;
&lt;/html&gt;
</code></pre>

Then, <code>=</code> will produce what you want:

<pre><code>&lt;!DOCTYPE html&gt;
&lt;html&gt;
 &lt;head&gt;
 &lt;title&gt;
 hello
 &lt;/title&gt;
 &lt;/head&gt;
 &lt;body&gt;
 world
 &lt;/body&gt;
&lt;/html&gt;
</code></pre>

blocks|key|232856|text|最好使用整洁的实用程序as+described+in+this+answer。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|232857|已经为这项工作编写了很好的工具|232858|entityMap|0|LINK|mutability|MUTABLE|url|https://stackoverflow.com/a/19960714/263858^0|B|R|0|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@$A|O|B|P|1|Q]]|C|$]]|$1|D|3|E|5|6|7|R|8|@]|9|@]|C|$]]|$1|F|3|-4|5|6|7|S|8|@]|9|@]|C|$]]]|G|$H|$5|I|J|K|C|$L|M]]]]

It would be better to use the tidy utility, <a href="https://stackoverflow.com/a/19960714/263858">as described in this answer</a>. 

Good tools have already been written for this job

blocks|key|232866|text|为了获得更好的结果，您应该使用专门的外部格式化程序。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|232867|您可以通过安装插件vim-autoformat自动集成tidy和html-beautify。在此之后，您可以通过一次击键来执行所安装的任何格式化程序。|offset|length|232868|entityMap|0|LINK|mutability|MUTABLE|url|https://github.com/vim-autoformat/vim-autoformat|1|http://tidy.sourceforge.net/|2|https://github.com/beautify-web/js-beautify^0|0|9|E|0|R|4|1|W|D|2|0^^$0|@$1|2|3|4|5|6|7|R|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|S|8|@]|9|@$D|T|E|U|1|V]|$D|W|E|X|1|Y]|$D|Z|E|10|1|11]]|A|$]]|$1|F|3|-4|5|6|7|12|8|@]|9|@]|A|$]]]|G|$H|$5|I|J|K|A|$L|M]]|N|$5|I|J|K|A|$L|O]]|P|$5|I|J|K|A|$L|Q]]]]

For a better result, you should use specialized external format programs.
You can integrate both <a href="http://tidy.sourceforge.net/" rel="nofollow noreferrer">tidy</a> and <a href="https://github.com/beautify-web/js-beautify" rel="nofollow noreferrer">html-beautify</a> automatically by installing the plugin <a href="https://github.com/vim-autoformat/vim-autoformat" rel="nofollow noreferrer">vim-autoformat</a>.
After that, you can execute whichever formatter is installed with a single keystroke.

I currently have a huge HTML file which doesn't have line breaks and just appears in a single line.

I want to format it in vim (macvim in particular). I tried the following options, but none of them has worked for me.

<ul>
<li>Selected the text and pressed = . This will only auto intend the code. But since the entire code is present in one line, it doesn't do anything</li>
<li>I tried this Plugin <a href="http://www.vim.org/scripts/script.php?script_id=3613" rel="noreferrer">http://www.vim.org/scripts/script.php?script_id=3613</a> This kind of works but will insert linebreaks only for the current tag. I want the entire file to be formatted</li>
</ul>

Is there a way to do this either using a Plugin or otherwise?

Thanks!

Format and Indent HTML in Vim

我目前有一个很大的HTML文件，它没有换行，只出现在一行中。我想用vim (特别是macvim)格式化它。我尝试了以下选项，但没有一个对我有效。选择文本并按=。这只会自动意向代码。但是，因为整个代码都在一行中，所以它不会做任何事情，我试过这个插件，这种方式可以工作，但是只会在当前的标签中插入换行符。，，，，。我希望整个...

问在Vim中格式化和缩进HTML
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在Vim中格式化和缩进HTMLEN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在Vim中格式化和缩进HTML
EN