CODEWITHSUNDEEP
cssvimsassctags
rhodee
rhodee

Reputation: 1267

How to make ctags + scss play nice

UPDATE: This question has been modified to reflect the very helpful comments and answer below. I've accepted the answer, but the full functionality is not working to-date.

Contents of .ctags (in ~/)

-R
--exclude=.git
--exclude=log 
--verbose=yes
--langdef=scss
--langmap=scss:.scss
--regex-scss=/^[ \t]*([^\t {][^{]{1,100})(\t| )*\{/| \1/d,definition/
--regex-scss=/^[@]mixin ([^ (]+).*/\1/m,mixing/

When I place my cursor under the target, vim says E426 tag not found: tag_name

Consider the following pattern:

footer{
 .wrapper{
  .general-info{
   .footer-links{
     a{@include ticker($bg, $white);}
    }
   }
  }
 }

In a separate file (modules.scss) in the directory, I have the definition for ticker:

@mixin ticker($color, $bg-color) {
 color: $color;
 background-color: $bg-color;
}

When I place my cursor under the target, vim still says E426 tag not found: tag_name

ctags does not index the ticker mixin. However I can use ctags to find methods from SCSS gem directly (e.g. darken).

Upvotes: 2

Views: 1160

Answers (1)

skeept
skeept

Reputation: 12423

adding a \ before the last { gives no warning when using ctags. I don't know if the tags produced give the desired result since I don't know the language.

The result would be:

--langdef=scss
--langmap=scss:.scss
--regex-scss=/^[ \t]*([^\t {][^{]{1,100})(\t| )*\{/| \1/d,definition/

Update: like I mentioned above, I don't know the language, so it is hard to check the actual definition of the tags. I looked online and the following code is listed as scss in some webpage. Suppose the tags you want to get are the words following mixing.

@mixin table-scaffolding {      
  th {                          
    text-align: center;         
    font-weight: bold;          
  }                             
  td, th { padding: 2px; }      
}                               

@mixin left($dist) {            
  float: left;                  
  margin-left: $dist;           
}                               

#data {                         
  @include left(10px);          
  @include table-scaffolding;   
}

then with the following:

--langdef=scss
--langmap=scss:.scss
--regex-scss=/^[ \t]*([^\t {][^{]{1,100})(\t| )*\{/| \1/d,definition/
--regex-scss=/^[@]mixin ([^ (]+).*/\1/m,mixin/
--regex-scss=/^[@]function ([^ (]+).*/\1/f,function/

you get the two new tags left and table-scaffolding. So if I am in the word left inside data hit ctrl+] it jumps to the line where data is defined. You have to be careful for the other keyword because it has a - in the word. So if you are on table and press ctrl+] you will get the same error tag not found. For this to work you have to add the following in your .vimrc

set iskeyword+=-

You should be able to generalize the above for other tags you need, or even build a general regular expression to handle all the tags, as you initially meant.

If you post a specific example of how the file you are trying to work with looks like, and what are the tags you are trying to obtain I am sure I or other people would be able to help figure out a expression for that.

Upvotes: 5

Related Questions