vim/after/syntax/vue.html

62 lines
4.7 KiB
HTML

runtime! after/syntax/html.vim
syn keyword vueComponentTag contained template containedin=htmlSpecialTagName
syn match vueDirective "\(^\|\s\)\zs[v:][-:.0-9_a-z]*" containedin=htmlTag,vueTag,htmlTagN contains=vueDirectiveClass nextgroup=vueDirectiveValue
syn match vueEvent "\(^\|\s\)\zs[@][-:.0-9_a-z]*" containedin=htmlTag,vueTag,htmlTagN nextgroup=vueEventValue
syn match vueConditional "\<v-else" containedin=htmlTag,vueTag,htmlTagN
syn match vueConditional "\<v-else-if" containedin=htmlTag,vueTag,htmlTagN nextgroup=vueConditionalValue
syn match vueConditional "\<v-if\|\<v-show" containedin=htmlTag,vueTag,htmlTagN nextgroup=vueConditionalValue
syn match vueSlot +\<slot=+he=e-1 containedin=htmlTag,vueTag,htmlTagN nextgroup=vueSlotValue
syn match vueFor "\<v-for" containedin=htmlTag,vueTag,htmlTagN nextgroup=vueForValue
syn match vueRef "\(^\|\s\)\zs:\?ref" containedin=htmlTag,vueTag,htmlTagN nextgroup=vueRefValue
syn region vueMustache start="{{"hs=s+2 end="}}"he=e-2
syn region vueDirectiveClass contained start=+class="+hs=s+7 end=+"+he=e-1 contains=vueObjectKey
syn region vueDirectiveValue contained start=+="+hs=s+2 end=+"+he=e-1
" syn region vueDirectiveValue contained start=+='+hs=s+2 end=+'+he=e-1
syntax match vueObjectKey contained /\<\k*\ze\s*:/ contains=jsFunctionKey skipwhite skipempty nextgroup=vueObjectValue
syntax region vueObjectKey contained start=+\z([']\)+hs=s+1 skip=+\\\%(\z1\|$\)+ end=+\z1\|$+he=e-1 contains=jsSpecial,@Spell skipwhite skipempty nextgroup=vueObjectValue
syntax region vueObjectValue contained matchgroup=jsNoise start=/:/ end=/[,}]\@=/ contains=@jsExpression extend
" TODO match vueObjectValue with a javascript expression
syn region vueEventValue contained start=+="+hs=s+2 end=+"+he=e-1
syn region vueEventValue contained start=+='+hs=s+2 end=+'+he=e-1
syn region vueConditionalValue contained start=+="+hs=s+2 end=+"+he=e-1
syn region vueConditionalValue contained start=+='+hs=s+2 end=+'+he=e-1
syn region vueForValue contained start=+="+hs=s+2 end=+"+he=e-1
syn region vueForValue contained start=+='+hs=s+2 end=+'+he=e-1
syn match vueRefValue contained +="[-:.0-9_a-z]*"+hs=s+2,he=e-1
syn match vueRefValue contained +='[-:.0-9_a-z]*'+hs=s+2,he=e-1
syn match vueSlotValue contained +"[-:.0-9_a-z]*"+hs=s+1,he=e-1
syn match vueSlotValue contained +'[-:.0-9_a-z]*'+hs=s+1,he=e-1
syn match vueComponentName contained "\(<\|</\)\zsvue-[0-9A-Za-z\-]\+\|\(<\|</\)\zs\u\+[0-9A-Za-z]\+\ze\(\s\|>\)" containedin=htmlTag,vueTag,htmlTagN
syn region vueLink start="<router-link\>[^>]*" end="</router-link>"me=e-14 contains=@Spell,vueTag,htmlEndTag,htmlSpecialChar,htmlPreProc,htmlComment,htmlLeadingSpace,javaScript,@htmlPreproc,vueComponentName
syn region vueTag start=+<[^/]+ end=+>+ fold contained contains=htmlString,htmlArg,htmlValue,htmlTagError,htmlEvent,htmlCssDefinition,@htmlPreproc,@htmlArgCluster,vueDynamicComponent
syn match vueComponentName contained "router-link" containedin=vueTag,htmlEndTag
hi! def link vueLink htmlLink
syn match vueDynamicComponent contained "\<component\>\|\<keep-alive\>\|\<router-link\>" containedin=htmlTag,vueTag,htmlTagN
syn match vueTransitionComponent contained "\<transition\>" containedin=htmlTag,vueTag,htmlTagN nextgroup=vueTransitionName,vueTransitionMode
syn region vueTransitionName contained start=+\sname="+hs=s+7 end=+"+he=e-1 containedin=htmlTag,vueTag,htmlTagN
syn region vueTransitionMode contained start=+\smode="+hs=s+7 end=+"+he=e-1 containedin=htmlTag,vueTag,htmlTagN
syn keyword vueTagSpecial contained template script style containedin=htmlTagN
syn keyword htmlArg contained scoped ts
" syn region cssClassRegion contained start=+classes="+hs=s+9 end=+"+he=e-1 contains=htmlSpecialChar,cssClassAttr,cssAttrNoise,cssClassName containedin=htmlTag,htmlTagN keepend
" syn region cssClassRegion contained start=+classes='+hs=s+9 end=+'+he=e-1 contains=htmlSpecialChar,cssClassAttr,cssAttrNoise,cssClassName containedin=htmlTag,htmlTagN keepend
syn match cssClassesAttr contained "\<[-a-zA-z0-9]*class[-a-zA-z0-9]*=" contains=htmlSpecialChar,cssClassAttr,cssAttrNoise,cssClassName containedin=htmlTag,vueTag,htmlTagN keepend nextgroup=vueClassesName
syn region vueClassesName contained start=+"+hs=s+1 end=+"+he=e-1
hi def link cssClassesAttr cssClassAttr
hi def link vueClassesname cssClassName
hi def link vueObjectKey cssClassName
hi def link vueDirectiveClass Noise
hi def link vueDirectiveClassName vueClassesName
hi def link vueMustache Identifier