Help with regex please

Hi.
I am using universal-ctags to create a tags list of my project. Then I’m using Vim to “go to definition”. The definition type I’m attempting to go to is a CSS class.

I have created the tags file no problem. It contains entries like:
.class1 …
.class2 …
etc.

In Vim, I should be able to press “Ctrl-]” with my cursor on a classname in an HTML file and “jump” to the CSS file containing that class. This works fine for other things like PHP functions etc.

It doesn’t work for CSS classes. I even know why. It doesn’t work because Ctrl-] looks for the class name… not the class name plus preceding dot.

Now, I have Googled this issue and I’m not alone. Others have suggested I place some regex patterns/rules in the ctags config which are SUPPOSED to make ctags generate a list of class names WITHOUT preceding dots.

The person with the problem initially had these lines in hist config:

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

He was advised to change these lines to:

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

to force dotless entries in the tags file.

Here’s the config he came up with (in full):

--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_-]+)/\1/c,class,classes/
--regex-css=/^[ \t]*#([A-Za-z0-9_-]+)/\1/i,id,ids/
--regex-css=/^[ \t]*(([A-Za-z0-9_-]+[ \t\n,]+)+)\{/\1/t,tag,tags/
--regex-css=/^[ \t]*@media\s+([A-Za-z0-9_-]+)/\1/m,media,medias/

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

Although the person says this now works for him, it doesn’t for me (and the thread is closed). Generation of the tags file still has entries WITH preceding dots and, hence, Ctrl-] fails to locate them.

Can anyone, with some regex expertise, help with this, please?

Why might it not work?

Also, the “two-line” code blocks above only mention SCSS rules. Are the entries in the “full” code block referencing CSS rules correct?

Thanks in advance for an help.

Mike

Welcome to the Free Code Camp forum!

We do not know what level of understanding you have about Regular Expressions, so we would not know how to guide I suggest you work through the Free Code Camp’s Regular Expression curriculum section, so you have a better understand of how regular expressions work.

Why are there multiple regular expressions for the –regex-scss? I ask because I am not familiar with how Vim uses the config.

Hi,

Thank you for your response.

My understanding of Regex is abysmal. I have tried and failed. I will give the Regex in your Curriculum section a go though, definitely.

I have no idea why there are multiple lines for --regex-scss. It’s not really a Vim issue (I do understand Vim) but a Universal Ctags issue and as I struggle badly with Regex, I can’t understand how Ctags uses the config to create the tags file. Basically you run “ctags -R .” in your project root and ctags reads the config rules and creates a tag list using those rules.

Does this help:
https://stackoverflow.com/questions/33647614/how-to-configure-ctags-to-work-with-css-scss-html