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

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

匹配规则如下:

  1. 前字符为行首或空白或:(冒号)
  2. 后字符为行尾或空白或;(分号)

正则如下:

1
'\(^\|\s\|:\)\@<=\c'._color.'\($\|\s\|;\)\@='

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
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