用于 Web 开发和设计的有用 Vim 插件(php、html、css、javascript)?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/3173963/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Useful Vim plugins for web development and design (php, html, css, javascript)?
提问by alexchenco
Right now I'm using surround.vimto enclose text in HTML tags, and a pluginthat highlights text according to the hex value in the CSS file (e.g. #888 will have gray background in the CSS file).
现在我使用surround.vim在 HTML 标签中包含文本,以及一个根据 CSS 文件中的十六进制值突出显示文本的插件(例如,#888 将在 CSS 文件中具有灰色背景)。
Are there other useful plugins for web development?
是否有其他有用的 Web 开发插件?
Recommendations
建议
Here is a list of the plugins mentioned in the answers so far:
以下是迄今为止答案中提到的插件列表:
- surround.vimto enclose text in HTML tags
- jslint.vimto check for JavaScript errors with JSLint
- Emmet.vimfor HTML and CSS high-speed coding
- phpfolding.vimto for automatic folding of PHP
- Syntasticfor automatic syntax checking of e.g. PHP
- Exuberant ctagsfor tagging of a wide array of languages.
- TagbarHelps view/navigate source, displays call signature in status area.
- surround.vim附上文字的HTML标签
- jslint.vim 使用 JSLint检查 JavaScript 错误
- 用于 HTML 和 CSS 高速编码的Emmet.vim
- phpfolding.vimto 用于自动折叠 PHP
- Syntastic用于自动检查例如 PHP 的语法
- 用于标记各种语言的丰富的 ctags。
- Tagbar帮助查看/导航源,在状态区域显示呼叫签名。
采纳答案by Ory Band
I've written answers for this questionand this questionexplaining how to get JavaScript syntax checking / lintingand source-code browsing / tag-listfor Vim using the community-driven jshint.com(which is way better than JSLint IMO) and Mozilla's DoctorJS(formerly jsctags).
我已经写了这个问题的答案,这个问题解释了如何使用社区驱动的jshint.com(比 JSLint IMO 更好)和 Mozilla 的Vim获取 JavaScript语法检查/linting和源代码浏览/标签列表DoctorJS(以前称为jsctags)。
回答by Jamey Pearce
回答by Luca Matteis
How about JSLint right in VIM, http://github.com/hallettj/jslint.vim?
VIM 中的 JSLint 怎么样,http://github.com/hallettj/jslint.vim ?
回答by Brian Wigginton
Here are the plugins I'm currently using as well as some vimrc mappings to make things a bit easier.
这是我目前使用的插件以及一些 vimrc 映射,使事情变得更容易。
Plugins
插件
Pathogenis an essential vim plugin for every user. It helps keep all the plugins you need organized within their own directories. This makes it much easier to uninstall plugins at a later time, since your plugins don't all live in the same tree. Pathogen will handle adding everything together at runtime.
Pathogen是每个用户必不可少的 vim 插件。它有助于将您需要的所有插件组织在它们自己的目录中。这使得以后卸载插件变得更加容易,因为您的插件并不都位于同一棵树中。Pathogen 将在运行时处理将所有内容添加在一起。
Command-Tadds the popular textmate feature that makes it easy to open files.
Command-T添加了流行的 textmate 功能,可以轻松打开文件。
Snipmategives vim the power of textmate like snippets.
Snipmate赋予 vim 像片段一样的textmate的力量。
Sparkupadds zencoding to vim to make it faster and easier to write HTML.
Sparkup在 vim 中添加了 zencoding,使编写 HTML 变得更快更容易。
NERDCommentermakes it easy to toggle commented blocks of code.
NERDCommenter可以轻松切换注释的代码块。
Syntasticadds syntax checking to lots of different file types, and if vim has signs support enabled, you get markers to the left of your line numbers telling you where your errors are.
Syntastic为许多不同的文件类型添加了语法检查,如果 vim 启用了符号支持,您会在行号左侧看到标记,告诉您错误在哪里。
.vimrc config settings
.vimrc 配置设置
Encode/Decode HTML to HTML Entities (Great for writing documentation)
将 HTML 编码/解码为 HTML 实体(非常适合编写文档)
"EASILY ESCAPE OR UNESCAPE HTML
function HtmlEscape()
silent s/&/\&/eg
silent s/</\</eg
silent s/>/\>/eg
endfunction
function HtmlUnEscape()
silent s/</</eg
silent s/>/>/eg
silent s/&/\&/eg
endfunction
map <silent> <c-h> :call HtmlEscape()<CR>
map <silent> <c-u> :call HtmlUnEscape()<CR>
Toggle Relative Line Numbers (new VIM 7.3 feature)
切换相对行号(VIM 7.3 的新功能)
function! g:ToggleNuMode()
if(&rnu == 1)
set nu
else
set rnu
endif
endfunc
nnoremap <C-L> :call g:ToggleNuMode()<cr>
Highlight unwanted whitespace
突出显示不需要的空格
"HIGHLIGHT POTENTIALLY UNWANTED WHITESPACE
highlight BadWhitespace term=standout ctermbg=red guibg=red
match BadWhitespace /[^* \t]\zs\s\+$\| \+\ze\t/
回答by Drasill
I like ZenCoding : http://www.vim.org/scripts/script.php?script_id=2981
我喜欢 ZenCoding:http: //www.vim.org/scripts/script.php?script_id =2981
Also, for folding Php : http://www.vim.org/scripts/script.php?script_id=1623
另外,对于折叠 PHP :http: //www.vim.org/scripts/script.php?script_id =1623
回答by George Marian
ctags aka Exuberant ctags
ctags 又名Exuberant ctags
That blog post also mentions the taglist plugin, which I have yet to use.
那篇博文还提到了我尚未使用的taglist 插件。
回答by Flavius Stef
回答by matias
Very helpful when dealing with html or xml: surround.vim; it allows to easily add/delete/change any kind of tags.
处理 html 或 xml 时非常有用:around.vim;它允许轻松添加/删除/更改任何类型的标签。
回答by romainl
Adapted by someone else from a couple of functions of mine(in turn adapted from others), this pluginallows you to turn "special" characters into HTML entities (and back) or URL Escapes (and back).
由其他人根据我的几个功能改编(反过来改编自其他人),这个插件允许您将“特殊”字符转换为 HTML 实体(并返回)或 URL 转义(并返回)。
This is extremelyuseful when writing stupid HTML Emails.
这在编写愚蠢的 HTML 电子邮件时非常有用。

