如何更新Vim以对新的html元素进行颜色编码

时间:2010-07-12 21:44:57

标签: vim html5

我想知道如何设置vim为新的html5元素(即“canvas”和“video”)着色,就像现有的“script”,“body”元素(或其他语言中的保留字一样,如python的“def”)等当前版本来自通常用于终端仿真器的MacPorts。

7 个答案:

答案 0 :(得分:29)

html.vim是Vim参考的语法文件,用于确定哪些标签将被着色。这个位置取决于你安装的Vim。在此语法文件中,您将看到许多行,如下所示:

" new html 4.0 tags
syn keyword htmlTagName contained abbr acronym bdo button col label
syn keyword htmlTagName contained colgroup del fieldset iframe ins legend
syn keyword htmlTagName contained object optgroup q s tbody tfoot thead

这些行定义语法关键字。在这种情况下,它们专门定义HTML标记名称。第一行告诉Vim为abbracronymbdobuttoncollabel标记着色。您可以使用以下语法告诉Vim为其他标记着色:

" new html 5 tags
syn keyword htmlTagName contained video canvas

Vim现在会为videocanvas标记以及您添加的任何其他关键字添加颜色。

但是,如果您更新内置html.vim,则下次更新Vim时会覆盖它,因此最佳做法是将规则附加到这些内置版本。为此,请在after/syntax文件夹中创建文件夹路径.vim,并在其中放置html.vim

下面的@ user240515提到了这个gist中的大量HTML 5元素和参数。将其中的内容粘贴到新创建的html.vim

请参阅:help html.vim了解更多信息。

答案 1 :(得分:22)

感谢您提出这个问题,并感谢您接受的答案!这是为html 5添加的新标签的完整列表,因为它们是在撰写本文时定义的:

" new html 5 tags
syn keyword htmlTagName contained article aside audio canvas command datalist
syn keyword htmlTagName contained details embed figcaption figure footer header
syn keyword htmlTagName contained hgroup keygen mark meter nav output progress
syn keyword htmlTagName contained rp rt ruby section source summary time video

答案 2 :(得分:10)

我正要尝试这个:

http://github.com/othree/html5.vim

似乎很完整。

编辑:我没有看到任何关于缩进的内容。 :(

编辑[12/23/2012]:我这样做:)但也许是后来添加的:https://github.com/othree/html5.vim/tree/master/indent

答案 3 :(得分:7)

答案 4 :(得分:4)

使用类似于michaelmichael所描述的方法来扩展html.vim语法文件,可以支持缩进。如果您html.vim中尚未~/.vim/indent,则可以使用找到的内容here创建~/.vim/indent/html.vim。在" [-- <ELEMENT ? - - ...> --] call <SID>HtmlIndentPush('a') call <SID>HtmlIndentPush('abbr') call <SID>HtmlIndentPush('acronym') call <SID>HtmlIndentPush('address') " ...and many more... 中,您将看到一组函数调用,这些函数调用汇集了一个HTML元素名称列表,如下所示:

" New HTML 5 elements
call<SID>HtmlIndentPush('table')
call<SID>HtmlIndentPush('article')
call<SID>HtmlIndentPush('aside')
call<SID>HtmlIndentPush('audio')
call<SID>HtmlIndentPush('canvas')
call<SID>HtmlIndentPush('command')
call<SID>HtmlIndentPush('datalist')
call<SID>HtmlIndentPush('details')
call<SID>HtmlIndentPush('embed')
call<SID>HtmlIndentPush('figcaption')
call<SID>HtmlIndentPush('figure')
call<SID>HtmlIndentPush('footer')
call<SID>HtmlIndentPush('header')
call<SID>HtmlIndentPush('hgroup')
call<SID>HtmlIndentPush('keygen')
call<SID>HtmlIndentPush('mark')
call<SID>HtmlIndentPush('meter')
call<SID>HtmlIndentPush('nav')
call<SID>HtmlIndentPush('output')
call<SID>HtmlIndentPush('progress')
call<SID>HtmlIndentPush('rp')
call<SID>HtmlIndentPush('rt')
call<SID>HtmlIndentPush('ruby')
call<SID>HtmlIndentPush('section')
call<SID>HtmlIndentPush('source')
call<SID>HtmlIndentPush('summary')
call<SID>HtmlIndentPush('time')
call<SID>HtmlIndentPush('video')

这些行定义了将触发基本标记缩进的标记。使用您想要触发缩进的任何HTML5标记扩展此列表。我将以下内容添加到此列表的末尾:

{{1}}

现在将在上面列出的HTML5标签上触发缩进。

答案 5 :(得分:4)

我根据上面的建议将一个html5缩进文件添加到othree / html5.vim的一个分支中。

请参阅http://github.com/briangershon/html5.vim

答案 6 :(得分:0)

vim(8.0)附带的.entries()文件非常过时。保持语法突出显示更新的一个好方法是使用维护良好的插件,例如vim-polygot,它保持更新。它的html.vim syntax支持syntax/html.vimcanvasvideosection(其他答案不支持),仅举几例。< / p>