使用Vim作为HTML编辑器

31
你知道Notepad++有这样的功能吗,当您单击一个标签(比如 )时,它会自动突出显示结束标签()?这个功能叫什么?如何调整Vim以具备此功能?
还有什么其他方法可以将Vim转变为强大高效的HTML编辑器?

1
matchit似乎可以工作,但是有没有一种方法可以突出显示匹配的标签而不是键入%?因为键入%更麻烦,而且当有很多类似的标签嵌套在一起时并不明显。 - user149135
6个回答

15

我使用vim进行所有HTML编辑。 我发现在vim中编辑HTML和XML最有帮助的三个插件是matchit、surround和allml

Matchit可以让你使用“%”跳转到开始/结束标签。Surround允许您轻松添加、删除和更改周围的标记。Allml为您提供了一组出色的映射,用于编辑(X)HTML和XML。


5
allml已更名为ragtag - zhon

7

使用标签包装所选文本:

    function! VisualTagsWrap()
        if !exists('g:tags_to_wrap')
            let g:tags_to_wrap=[]
        endif
        let g:tags_to_wrap=split(input('space separated tags to wrap block: ', join(g:tags_to_wrap, ' ')), '\s\+')
        if len(g:tags_to_wrap)>0
            execute 'normal! `>a</'.join(reverse(g:tags_to_wrap), '></').'>'
            execute 'normal! `<i<'.join(reverse(g:tags_to_wrap), '><').'>'
        endif
    endfunction


vnoremap <silent>,w <ESC>:call VisualTagsWrap()<CR>

为标签突出显示闭合括号:

set matchpairs+=<:>

虚拟文本(在插入模式下键入“lorem”):

inoreabbrev lorem Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.

嗨,这些代码应该放在哪里?抱歉,我是一个新手VIM使用者,所以你必须非常清楚地说明!:( - user149135
1
将该代码放入您的 .vimrc 文件中。在选择模式下使用 ,w 来换行文本,在标签括号之间使用 % 进行切换。 - user256497
今天我把这个加到了我的vimrc中,我喜欢它。现在我需要的是像vi<那样在一对标签之间进行可视化选择。 - asfallows
1
使用 cit 命令来更改标签,例如 haha(也可以使用 vit)。 - Jay

4

匹配标签:

可以使用matchit插件来实现。Vim 6及以上版本已经默认安装了matchit.vim插件。要安装matchit,请阅读:help matchit-install

确保在vimrc中添加了filetype plugin on

安装完成后,使用%来匹配开始/结束标签。要获取更多帮助,请查看:help matchit-intro


真的吗?它不在里面,我正在运行7.2,我必须单独安装它。 - user149135
是的。至少在带有Cygwin和Ubuntu Jaunty的vim 7.2中是这样的。 - shoban

1
在 Fedora 15 中,matchit.vim 包含在 vim-common 软件包中。然后将以下内容添加到您的 ~/.vimrc 文件中,以使其正常工作:

source /usr/share/vim/vim73/macros/matchit.vim

接着只需按下 Shift+5 (也就是 %) 即可跳转到匹配的标签。

如果编辑没有 .html 后缀的 HTML 文件,请使用以下命令:

:set filetype=html

来激活 matchit 宏。


1

查看此链接

它描述了一个错误报告和可能修复它的补丁。

set matchpairs+=<:>
set showmatch
set matchtime=3

0

Emmet。只需使用vim-emmet。它有一些很酷的杀手级功能。您只需编写nav,然后<ctrl + y> ,ctrl + y,然后,)即可自动执行<nav></nav>.myclass,然后<ctrl + y> ,,然后您会得到<div class="myclass"></div>。最重要的是,键入html:5,然后按ctrl + y,然后,,您将获得设置好的HTML文档。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接