mirror of
https://github.com/leafOfTree/vim-vue-plugin.git
synced 2025-12-10 22:51:52 +08:00
chore: add option to highlight vue attr differently
This commit is contained in:
@@ -51,8 +51,9 @@ Ex:
|
|||||||
| `g:vim_vue_plugin_use_pug`\* | Enable `vim-pug` pug syntax for `<template lang="pug">`. | 0 |
|
| `g:vim_vue_plugin_use_pug`\* | Enable `vim-pug` pug syntax for `<template lang="pug">`. | 0 |
|
||||||
| `g:vim_vue_plugin_use_less` | Enable less syntax for `<style lang="less">`. | 0 |
|
| `g:vim_vue_plugin_use_less` | Enable less syntax for `<style lang="less">`. | 0 |
|
||||||
| `g:vim_vue_plugin_use_sass` | Enable sass/scss syntax for `<style lang="sass">`(or scss). | 0 |
|
| `g:vim_vue_plugin_use_sass` | Enable sass/scss syntax for `<style lang="sass">`(or scss). | 0 |
|
||||||
| `g:vim_vue_plugin_debug` | Echo debug message in `messages` list. Useful to debug if unexpendted indents occur. | 0 |
|
|
||||||
| `g:vim_vue_plugin_has_init_indent` | Initially indent one tab inside `style/script` tags. | 0 for `.vue`. 1 for `.wpy` |
|
| `g:vim_vue_plugin_has_init_indent` | Initially indent one tab inside `style/script` tags. | 0 for `.vue`. 1 for `.wpy` |
|
||||||
|
| `g:vim_vue_plugin_highlight_vue_attr` | Highlight vue attributes differently. | 1 |
|
||||||
|
| `g:vim_vue_plugin_debug` | Echo debug message in `messages` list. Useful to debug if unexpendted indents occur. | 0 |
|
||||||
|
|
||||||
\*: Vim may be slow if the feature is enabled. Find a balance between syntax highlight and speed. By the way, custom syntax could be added in `~/.vim/syntax` or `$VIM/vimfiles/syntax`.
|
\*: Vim may be slow if the feature is enabled. Find a balance between syntax highlight and speed. By the way, custom syntax could be added in `~/.vim/syntax` or `$VIM/vimfiles/syntax`.
|
||||||
|
|
||||||
|
|||||||
@@ -1,13 +1,29 @@
|
|||||||
|
"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
|
||||||
|
"
|
||||||
|
" Config {{{
|
||||||
|
"
|
||||||
|
"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
|
||||||
|
let s:highlight_vue_attr = !exists("g:vim_vue_plugin_highlight_vue_attr")
|
||||||
|
\ || g:vim_vue_plugin_highlight_vue_attr == 1
|
||||||
|
")}}}
|
||||||
|
|
||||||
|
"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
|
||||||
|
"
|
||||||
|
" Syntax highlight {{{
|
||||||
|
"
|
||||||
|
"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
|
||||||
syntax match VueComponentName containedin=htmlTagN '\v\C<[a-z0-9]+(-[a-z0-9]+)+>'
|
syntax match VueComponentName containedin=htmlTagN '\v\C<[a-z0-9]+(-[a-z0-9]+)+>'
|
||||||
syntax match VueComponentName containedin=htmlTagN '\v\C<([A-Z][a-zA-Z0-9]+)+>'
|
syntax match VueComponentName containedin=htmlTagN '\v\C<([A-Z][a-zA-Z0-9]+)+>'
|
||||||
|
|
||||||
syntax match VueAttr '\v(\S)@<![v:\@][^\=]*(\=\"[^"]*\")?'
|
syntax match VueAttr '\v(\S)@<![v:\@][^\=]*(\=\"[^"]*\")?'
|
||||||
\ containedin=htmlTag
|
\ containedin=htmlTag
|
||||||
\ contains=VueKey,VueValue
|
\ contains=VueKey,VueQuote
|
||||||
|
|
||||||
syntax match VueKey contained '\v[v:\@][^\=]+'
|
syntax match VueKey contained '\v[v:\@][^\=]+'
|
||||||
|
syntax region VueQuote contained
|
||||||
|
\ start='"' end='"' contains=VueValue
|
||||||
syntax match VueValue contained '\v\"\zs[^"]*\ze\"'
|
syntax match VueValue contained '\v\"\zs[^"]*\ze\"'
|
||||||
\ contains=VueInject,javaScriptStringS,javaScriptRepeat
|
\ contains=VueInject,javaScriptStringS,javaScriptRepeat,javaScriptOperator
|
||||||
|
|
||||||
syntax match VueInject contained '\v\$\w*'
|
syntax match VueInject contained '\v\$\w*'
|
||||||
|
|
||||||
@@ -27,20 +43,33 @@ syntax region VueExpression
|
|||||||
" Wepy directive syntax
|
" Wepy directive syntax
|
||||||
syntax match VueAttr '\v(\S)@<!wx[^\=]+(\=\"[^"]*\")?'
|
syntax match VueAttr '\v(\S)@<!wx[^\=]+(\=\"[^"]*\")?'
|
||||||
\ containedin=htmlTag
|
\ containedin=htmlTag
|
||||||
\ contains=VueKey,VueValue,VueInject
|
\ contains=VueKey,VueQuote
|
||||||
|
|
||||||
syntax match VueKey contained '\vwx[^\=]+'
|
syntax match VueKey contained '\vwx[^\=]+'
|
||||||
syntax match VueCustomTag containedin=htmlTagN '\v<(view|text|block|image)>'
|
syntax match VueCustomTag containedin=htmlTagN '\v<(view|text|block|image)>'
|
||||||
|
|
||||||
syn region javaScriptStringS start=+'+ skip=+\\\\\|\\'+ end=+'\|$+ contains=javaScriptSpecial,@htmlPreproc
|
syn region javaScriptStringS
|
||||||
syn keyword javaScriptRepeat while for do in
|
\ start=+'+ skip=+\\\\\|\\'+ end=+'\|$+ contained
|
||||||
|
syn region javaScriptStringD
|
||||||
|
\ start=+"+ skip=+\\\\\|\\"+ end=+"\|$+ contained
|
||||||
|
syn keyword javaScriptRepeat in contained
|
||||||
|
syn match javaScriptOperator '[\!\|\&\+\-\<\>\=\%\/\*\~\^]\{1}' contained
|
||||||
|
|
||||||
highlight default link VueAttr Comment
|
highlight default link VueAttr htmlTag
|
||||||
|
if s:highlight_vue_attr
|
||||||
highlight default link VueKey Type
|
highlight default link VueKey Type
|
||||||
|
highlight default link VueQuote VueAttr
|
||||||
highlight default link VueValue Function
|
highlight default link VueValue Function
|
||||||
|
else
|
||||||
|
highlight default link VueKey htmlArg
|
||||||
|
highlight default link VueQuote String
|
||||||
|
highlight default link VueValue String
|
||||||
|
endif
|
||||||
highlight default link VueInject Constant
|
highlight default link VueInject Constant
|
||||||
highlight default link VueBrace Type
|
highlight default link VueBrace Type
|
||||||
highlight default link VueComponentName Statement
|
highlight default link VueComponentName Statement
|
||||||
highlight default link VueCustomTag Statement
|
highlight default link VueCustomTag Statement
|
||||||
highlight default link javaScriptRepeat Statement
|
highlight default link javaScriptRepeat Statement
|
||||||
highlight default link javaScriptStringS String
|
highlight default link javaScriptStringS String
|
||||||
|
"}}}
|
||||||
|
" vim: fdm=marker
|
||||||
|
|||||||
Reference in New Issue
Block a user