From 6c09d4787bafaccc577564a8c7f6aed5b2236dae Mon Sep 17 00:00:00 2001
From: leafOfTree <node_github@163.com>
Date: Fri, 17 Jul 2020 07:42:31 +0800
Subject: [PATCH] Add option to highlight vue keywords

---
 README.md                 |  5 +++--
 syntax/vue-html.vim       |  2 +-
 syntax/vue-javascript.vim | 35 +++++++++++++++++++++++++++++++++++
 syntax/vue.vim            |  3 +++
 4 files changed, 42 insertions(+), 3 deletions(-)
 create mode 100644 syntax/vue-javascript.vim

diff --git a/README.md b/README.md
index 285b9d8..6f200b4 100644
--- a/README.md
+++ b/README.md
@@ -69,6 +69,7 @@ Set global variable to `1` to enable or `0` to disable. Ex:
 | `g:vim_vue_plugin_use_stylus`         | Enable stylus syntax for `<style lang="stylus">`.                                                      | 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_highlight_vue_attr` | Highlight vue attribute value as expression instead of string.                                         | 0 |
+| `g:vim_vue_plugin_highlight_vue_keyword` | Highlight vue keyword like `data`, `methods`, ...                       | 0 |
 | `g:vim_vue_plugin_use_foldexpr`       | Enable builtin `foldexpr` foldmethod.                                                                  | 0 |
 | `g:vim_vue_plugin_debug`              | Echo debug messages in `messages` list. Useful to debug if unexpected indents occur.                   | 0 |
 
@@ -76,8 +77,8 @@ Set global variable to `1` to enable or `0` to disable. Ex:
 
 **Note**
 
-- `filetype` is set to `vue` so autocmds and other custom settings for `javascript` have to be manually enabled for `vue`.
-- `g:vim_vue_plugin_load_full_syntax` currently applies to `HTML/Sass/Less`.
+- `g:vim_vue_plugin_load_full_syntax` applies to other `HTML/Sass/Less` plugins.
+- `filetype` is set to `vue` so autocmds and other settings for `javascript` have to be manually enabled for `vue`.
 
 ## Context based behavior
 
diff --git a/syntax/vue-html.vim b/syntax/vue-html.vim
index 843c9bf..64dc050 100644
--- a/syntax/vue-html.vim
+++ b/syntax/vue-html.vim
@@ -5,7 +5,7 @@
 """""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
 let s:highlight_vue_attr = exists("g:vim_vue_plugin_highlight_vue_attr")
       \ && g:vim_vue_plugin_highlight_vue_attr == 1
-")}}}
+"}}}
 
 """""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
 "
diff --git a/syntax/vue-javascript.vim b/syntax/vue-javascript.vim
new file mode 100644
index 0000000..2530b2a
--- /dev/null
+++ b/syntax/vue-javascript.vim
@@ -0,0 +1,35 @@
+"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
+"
+" Config {{{
+"
+"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
+let s:highlight_vue_keyword = exists("g:vim_vue_plugin_highlight_vue_keyword")
+      \ && g:vim_vue_plugin_highlight_vue_keyword == 1
+
+if !s:highlight_vue_keyword | finish | endif
+"}}}
+
+"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
+"
+" Syntax highlight {{{
+"
+"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
+let s:vue_keywords = 'name parent functional delimiters comments components directives filters extends mixins inheritAttrs model props propsData data computed watch methods template render renderError inject provide beforeCreate created beforeMount mounted beforeUpdate updated activated deactivated beforeDestroy destroyed'
+
+let s:vue_keywords_regexp = join(split(s:vue_keywords, ' '), '|')
+execute 'syntax match vueObjectKey /\v<('.s:vue_keywords_regexp.')\ze\s*:/'
+      \.' containedin=jsObject,javascriptVueScript'
+      \.' skipwhite skipempty nextgroup=jsObjectValue'
+
+execute 'syntax match vueObjectFuncName /\v<('.s:vue_keywords_regexp.')\ze\_s*\(/'
+      \.' containedin=jsObject,javascriptVueScript'
+      \.' skipwhite skipempty nextgroup=jsFuncArgs'
+
+execute 'syntax match vueObjectFuncKey /\v<('.s:vue_keywords_regexp.')\ze\s*:\s*function>/'
+      \.' containedin=jsObject,javascriptVueScript'
+      \.' skipwhite skipempty nextgroup=jsFuncArgs'
+
+highlight default link vueObjectKey Constant
+highlight default link vueObjectFuncName Constant
+highlight default link vueObjectFuncKey Constant
+"}}}
diff --git a/syntax/vue.vim b/syntax/vue.vim
index d861ee0..58adb40 100644
--- a/syntax/vue.vim
+++ b/syntax/vue.vim
@@ -102,6 +102,9 @@ if hlexists('javaScriptComment') == 0
   call vue#Log('load javascript cluster')
   call s:LoadSyntax('@htmlJavaScript', 'javascript')
 endif
+
+" Load vue-javascript syntax
+runtime syntax/vue-javascript.vim
 "}}}
 
 """""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""