左手's Blog

vim-coloresque是一款高亮插件，将css/sass/less中的颜色用背景色高亮出来方便预览。用了一段时间发现代码补全一定程度上受影响，自己对插件进行了一些优化，修改后git地址：https://github.com/thinkjs/vim-coloresque。

看插件github上的issue，插件中对isk这个选项的设置影响了补全，全并且影响了vim全局的keyword识别，直接注释掉isk+=-、isk+=#、 isk+=# 解决了补全问题但针对colorDict的高亮识别又发生错误，例如样式名为 .red或.common-red-btn，此处的red会被高亮。作者使用"\<"单词边界来识别colorDict，修改isk以后单词边界识别出错高亮出错，想到用正则表达式来调整此处的colorDict匹配。

匹配规则如下：
1. 前字符为行首或空白或:（冒号）
2. 后字符为行尾或空白或;（分号）

正则如下：
'\(^\|\s\|:\)\@<=\c'._color.'\($\|\s\|;\)\@='

vim中使用@<=作逆序环视、@=做顺序环视(vim中使用:h @<=查看详细介绍)，修改后效果不错，符合我的应用场景。diff代码如下：

From f162c7a118caba4af655741feeae11720329bb4e Mon Sep 17 00:00:00 2001
From: leaf
Date: Wed, 21 Jan 2015 16:27:40 +0800
Subject: [PATCH] remove "isk" change, improve color dict regexp

---
 after/syntax/css/vim-coloresque.vim | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/after/syntax/css/vim-coloresque.vim b/after/syntax/css/vim-coloresque.vim
index c80a9a5..b60f863 100644
--- a/after/syntax/css/vim-coloresque.vim
+++ b/after/syntax/css/vim-coloresque.vim
@@ -122,9 +122,9 @@ function! s:VimCssInit(update)
     if a:update==1
         call s:ClearMatches()
     endif
-    :set isk+=-
-    :set isk+=#
-    :set isk+=.
+    " :set isk+=-
+    " :set isk+=#
+    " :set isk+=.
 
     if len(keys(b:color_pattern))>0
         call s:RestoreColors()
@@ -301,7 +301,10 @@ function! s:AdditionalColors()
   "let w:colorDictRegExp = '\(' 
   for _color in keys(w:colorDict)
     "let w:colorDictRegExp.='\<'._color.'\>\|' 
-    call s:MatchColorValue(strpart(w:colorDict[tolower(_color)], 1), '\<\c'._color.'\>')
+    " old
+    " call s:MatchColorValue(strpart(w:colorDict[tolower(_color)], 1), '\<\c'._color.'\>')
+    " new regexp
+    call s:MatchColorValue(strpart(w:colorDict[tolower(_color)], 1), '\(^\|\s\|:\)\@<=\c'._color.'\($\|\s\|;\)\@=')
   endfor
   "let w:colorDictRegExp=strpart(w:colorDictRegExp, 0, len(w:colorDictRegExp)-2).'\)\c'
 endfunction
-- 
1.7.11.1