如何配置 ctags 以与 CSS、SCSS、HTML 一起使用？

Question

我已经阅读了很多关于 Whosebug 的博文和答案，但似乎我做错了什么，因为我仍然有 E388: Couldn't find definition 错误。我做了什么：

从这里下载 ctags http://ctags.sourceforge.net/
通过以下方式安装：./configure && make install
在我的 .vimrc 文件中设置 tags+=tags;$HOME
在 ~/.ctags 中添加一些行（见下文）
在项目根目录中执行 ctags -R . 并得到一些警告（见下文）
通过 :tag .<C-D> 检查类，这给了我一个类的大列表（很高兴）

警告：

ctags: Warning: regcomp ([A-Za-z0-9._$]+)[ t]*[:=][ t]*{: Unmatched \{
ctags: Warning: regcomp ([A-Za-z0-9._$()]+)[ t]*[:=][ t]*function[ t]*(: Unmatched ( or \(
ctags: Warning: regcomp ([A-Za-z0-9._$]+)[ t]*[:=][ t]*[: Invalid regular expression
ctags: Warning: cannot open source file "static/img/touch/packages" : No such file or directory

我的 ~/.ctags 文件如下所示：

--exclude=*.min.js
--exclude=*.min.css
--exclude=*.map
--exclude=.backup
--exclude=.sass-cache
--exclude=vendors
--exclude=.git

--langdef=css
--langmap=css:.css
--langmap=css:+.sass
--langmap=css:+.styl
--langmap=css:+.less
--regex-css=/^[ \t]*\.([A-Za-z0-9_-]+)/./c,class,classes/
--regex-css=/^[ \t]*#([A-Za-z0-9_-]+)/#/i,id,ids/
--regex-css=/^[ \t]*(([A-Za-z0-9_-]+[ \t\n,]+)+)\{//t,tag,tags/
--regex-css=/^[ \t]*@media\s+([A-Za-z0-9_-]+)//m,media,medias/

--langdef=scss
--langmap=scss:.scss
--regex-scss=/^[ \t]*@mixin ([A-Za-z0-9_-]+)//m,mixin,mixins/
--regex-scss=/^[ \t]*$([A-Za-z0-9_-]+)//v,variable,variables/
--regex-scss=/^([A-Za-z0-9_-]*)*(\.[A-Za-z0-9_-]+) *[,{]//c,class,classes/
--regex-scss=/^[ \t]+(\.[A-Za-z0-9_-]+) *[,{]//c,class,classes/
--regex-scss=/^(.*)*\#([A-Za-z0-9_-]+) *[,{]//i,id,ids/
--regex-scss=/^[ \t]*#([A-Za-z0-9_-]+)//i,id,ids/
--regex-scss=/(^([A-Za-z0-9_-])*([A-Za-z0-9_-]+)) *[,|\{]//t,tag,tags/
--regex-scss=/(^([^\/\/])*)[ \t]+([A-Za-z0-9_-]+)) *[,|\{]//t,tag,tags/
--regex-scss=/(^(.*, *)([A-Za-z0-9_-]+)) *[,|\{]//t,tag,tags/
--regex-scss=/(^[ \t]+([A-Za-z0-9_-]+)) *[,|\{]//t,tag,tags/
--regex-scss=/^[ \t]*@media\s+([A-Za-z0-9_-]+)//d,media,media/

--regex-html=/id="([A-Za-z0-9_-]+)"//i,id,ids/
--regex-html=/class="([A-Za-z0-9_-]+)"//c,class,classes/

--langdef=js
--langmap=js:.js
--regex-js=/([A-Za-z0-9._$]+)[ t]*[:=][ t]*{/1/,object/
--regex-js=/([A-Za-z0-9._$()]+)[ t]*[:=][ t]*function[ t]*(/1/,function/
--regex-js=/function[ t]+([A-Za-z0-9._$]+)[ t]*(([^)]))/1/,function/
--regex-js=/([A-Za-z0-9._$]+)[ t]*[:=][ t]*[/1/,array/
--regex-js=/([^= ]+)[ t]*=[ t]*[^"]'[^']*/1/,string/
--regex-js=/([^= ]+)[ t]*=[ t]*[^']"[^"]*/1/,string/

项目结构：

无论在哪里（static/index.html、static/css/main.scss 或 static/css/components/set.scss）我尝试使用 ]^D“跳转到定义”我总是得到 E388: Couldn't find definition。会发生什么？

更新

<C-]> 在 _col-2 名称开头按下：

在 <div class="_col-2">.. 的情况下给出 E426: Tag not found: _col。看起来 vim 没有正确检测到类名。
在 .class { @extend ._col-2; } 的情况下给出相同的结果。

按照@romainl 的建议，在 .vimrc 中添加 set iskeyword+=- 以破折号成为关键字的一部分后，按 <div class="_col-2">.. 会将我抛到该行的开头。

Answer 1

]<C-D> 动作用于 宏定义，由 Vim 的内部文件搜索和 'define' 选项提供支持。它不使用标签数据库，主要用于 C/C++ 宏。你想要的是等同于 :tag 命令（这显然对你有用）。这是<C-]>（或<C-LeftMouse>）；您会直接在 :help :tag.

下找到它

Answer 2

关于E426: Tag not found: txal-center…

您 .ctags 中的这些行将索引 .foo-bar — 前导点 — 在 *.scss 文件中：

--regex-scss=/^([A-Za-z0-9_-]*)*(\.[A-Za-z0-9_-]+) *[,{]//c,class,classes/
--regex-scss=/^[ \t]+(\.[A-Za-z0-9_-]+) *[,{]//c,class,classes/

当您在 HTML 文档中的 class 名称上按 <C-]> 时，Vim 将查找确切的 class 名称，例如 foo-bar，但它不会找到它，因为您的 tags 文件中只有 .foo-bar。这是因为 Vim 默认进行 "whole-word" 搜索。

这个特定问题的解决方法是在标签中去掉点：

--regex-scss=/^([A-Za-z0-9_-]*)*\.([A-Za-z0-9_-]+) *[,{]//c,class,classes/
--regex-scss=/^[ \t]+\.([A-Za-z0-9_-]+) *[,{]//c,class,classes/

Answer 3

看来我找到了解决方案，感谢@romainl 和@IngoKarkat 提供的从正则表达式中排除点的提示。如果您还没有尝试使用 HTML、CSS、SCSS.

，请执行以下步骤

下载latest version并解压
进入提取的文件夹并运行:./configure && make && sudo make install。现在通过运行ning ctags --help
创建 ~/.ctags 文件并将代码放在那里（见下文）
将行 set tags+=tags;$HOME 添加到您的 ~/.vimrc，然后运行 :so ~/.vimrc 更新选项。 tags+=tags;$HOME 表示从当前文件夹到您的主目录递归搜索 tags 文件。如果你更喜欢另一个
进入您的项目文件夹并运行 ctags -R .。它创建 ctags 文件，该文件是找到的定义的索引（数据库）。
现在转到 vim vim . 并通过 :tag ^D 检查标签是否可用（按 CTRL-D）
现在您可以按b]、CTRL-]、CTRL-T相应地列出标签、转到定义、返回上一个位置。
（可选）您可以运行 ctags -R -f .tags 生成隐藏文件而不是默认的tags 名称。不要忘记将 set tags+=tags;$HOME 更改为 set tags+=.tags;$HOME
（可选）如果您想更快地更新索引，请将 nmap <leader><leader> :!ctags -R -f .tags<CR> 添加到 .vimrc。通过 :pwd 跟踪父目录，以免每个项目文件夹被 tags 文件污染。

~/.ctags内容：

--exclude=*.min.js
--exclude=*.min.css
--exclude=*.map
--exclude=.backup
--exclude=.sass-cache
--exclude=vendors
--exclude=.git

--langdef=css
--langmap=css:.css
--langmap=css:+.styl
--langmap=css:+.less
--regex-css=/^[ \t]*\.([A-Za-z0-9_-]+)//c,class,classes/
--regex-css=/^[ \t]*#([A-Za-z0-9_-]+)//i,id,ids/
--regex-css=/^[ \t]*(([A-Za-z0-9_-]+[ \t\n,]+)+)\{//t,tag,tags/
--regex-css=/^[ \t]*@media\s+([A-Za-z0-9_-]+)//m,media,medias/

--langdef=scss
--langmap=scss:.sass
--langmap=scss:+.scss
--regex-scss=/^[ \t]*@mixin ([A-Za-z0-9_-]+)//m,mixin,mixins/
--regex-scss=/^[ \t]*@function ([A-Za-z0-9_-]+)//f,function,functions/
--regex-scss=/^[ \t]*$([A-Za-z0-9_-]+)//v,variable,variables/
--regex-scss=/^([A-Za-z0-9_-]*)*\.([A-Za-z0-9_-]+) *[,{]//c,class,classes/
--regex-scss=/^[ \t]+\.([A-Za-z0-9_-]+) *[,{]//c,class,classes/
--regex-scss=/^(.*)*\#([A-Za-z0-9_-]+) *[,{]//i,id,ids/
--regex-scss=/^[ \t]*#([A-Za-z0-9_-]+)//i,id,ids/
--regex-scss=/(^([A-Za-z0-9_-])*([A-Za-z0-9_-]+)) *[,|\{]//t,tag,tags/
--regex-scss=/(^([^\/\/])*)[ \t]+([A-Za-z0-9_-]+)) *[,|\{]//t,tag,tags/
--regex-scss=/(^(.*, *)([A-Za-z0-9_-]+)) *[,|\{]//t,tag,tags/
--regex-scss=/(^[ \t]+([A-Za-z0-9_-]+)) *[,|\{]//t,tag,tags/
--regex-scss=/^[ \t]*@media\s+([A-Za-z0-9_-]+)//d,media,media/

如何配置 ctags 以与 CSS、SCSS、HTML 一起使用？

How to configure ctags to work with CSS, SCSS, HTML?

vim

ctags

exuberant-ctags