Update doc

Add Stylus support

.travis.yml

@@ -3,5 +3,10 @@ language: minimal
 install:
   - git clone --depth=1 https://github.com/leafOfTree/test ../test
 
+  - git clone https://github.com/digitaltoad/vim-pug ../vim-pug --depth=1
+  - git clone https://github.com/kchmck/vim-coffee-script ../vim-coffee-script --depth=1
+  - git clone https://github.com/leafgarland/typescript-vim ../typescript-vim --depth=1
+  - git clone https://github.com/iloginow/vim-stylus.git ../vim-stylus --depth=1
+
 script:
   - bash ../test/start.sh vue vim-vue-plugin

README.md

@@ -2,7 +2,7 @@
 
 <p align="center">
 <a href="https://github.com/altercation/vim-colors-solarized">
-<img alt="screenshot" src="https://raw.githubusercontent.com/leafOfTree/leafOfTree.github.io/master/vim-vue-plugin-screenshot.png" width="200" />
+<img alt="screenshot" src="https://raw.githubusercontent.com/leafOfTree/leafOfTree.github.io/master/vim-vue-plugin-screenshot.png" width="220" />
 </a>
 </p>
 
@@ -11,6 +11,7 @@ Vim syntax and indent plugin for `.vue` files. Mainly inspired by [mxw/vim-jsx][
 ## Installation
 
 <details>
+
 <summary><a>How to install</a></summary>
 
 - [VundleVim][2]
@@ -34,7 +35,7 @@ Vim syntax and indent plugin for `.vue` files. Mainly inspired by [mxw/vim-jsx][
 <br />
 </details>
 
-This plugin works if `filetype` is set to `vue`. Please stay up to date. Feel free to open an issue or a pull request.
+This plugin works if `filetype` is set to `vue`. Please stay up to date. Feel free to open an issue or pull request.
 
 ## How it works
 
@@ -43,12 +44,12 @@ Since `.vue` is a combination of CSS, HTML and JavaScript, so is `vim-vue-plugin
 Supports
 
 - Vue directives.
-- Less/Sass/Scss, Pug with [vim-pug][4], Coffee with [vim-coffee-script][11].^
+- Less/Sass/Scss, Pug with [vim-pug][4], Coffee with [vim-coffee-script][11], TypeScript with [typescript-vim][14] or [yats.vim][15], Stylus with [vim-stylus][16].^
 - A builtin `foldexpr` foldmethod.^
 - [emmet-vim][10] HTML/CSS/JavaScript filetype detection.
 - `.wpy` files from [WePY][6].
 
-^: see Configuration for details.
+^: see Configuration for details. Relative plugins need to be installed.
 
 ## Configuration
 
@@ -61,8 +62,10 @@ Set global variable to `1` to enable or `0` to disable. Ex:
 | `g:vim_vue_plugin_load_full_syntax`\* | Enable: load all syntax files in `runtimepath` to enable related syntax plugins.<br> Disable: only in `$VIMRUNTIME/syntax`, `~/.vim/syntax` and `$VIM/vimfiles/syntax` | 0 |
 | `g:vim_vue_plugin_use_pug`\*          | Enable pug syntax for `<template lang="pug">`.                                                         | 0 |
 | `g:vim_vue_plugin_use_coffee`         | Enable coffee syntax for `<script lang="coffee">`.                                                     | 0 |
+| `g:vim_vue_plugin_use_typescript`     | Enable typescript syntax for `<script lang="ts">`.                                                     | 0 |
 | `g:vim_vue_plugin_use_less`           | Enable less syntax for `<style lang="less">`.                                                          | 0 |
-| `g:vim_vue_plugin_use_sass`           | Enable scss syntax for `<style lang="scss">`(or sass fo `lang="sass"`).                                | 0 |
+| `g:vim_vue_plugin_use_sass`           | Enable scss/sass syntax for `<style lang="scss|sass">`.                               | 0 |
+| `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_use_foldexpr`       | Enable builtin `foldexpr` foldmethod.                                                                  | 0 |
@@ -73,8 +76,7 @@ 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` applies to `JavaScript/HTML/CSS/SASS/LESS`.
-- `g:vim_vue_plugin_use_foldexpr` default value used to be `1`, but it's changed to `0` now.
+- `g:vim_vue_plugin_load_full_syntax` currently applies to `HTML/Sass/Less`.
 
 ## Context based behavior
 
@@ -108,7 +110,7 @@ Currently emmet-vim works regarding your HTML/CSS/JavaScript emmet settings, but
 
 Since there are many sub languages included, most delays come from syntax files overload. A variable named `b:current_loading_main_syntax` is set to `vue` which can be used as loading condition if you'd like to manually find and modify the syntax files causing overload.
 
-For example, the builtin syntax `sass.vim` and `less.vim` in vim8.1 runtime and `pug.vim` in vim-pug/syntax will always load `css.vim` which this plugin already loads. It can be optimized like
+For example, the builtin syntax `sass.vim` and `less.vim` in vim8.1 runtime and `pug.vim` in vim-pug/syntax always load `css.vim` which this plugin already loads. It can be optimized like
 
 ```diff
 - runtime! syntax/css.vim
@@ -146,3 +148,6 @@ This plugin is under [The Unlicense][8]. Other than this, `lib/indent/*` files a
 [11]: https://github.com/kchmck/vim-coffee-script
 [12]: https://travis-ci.com/leafOfTree/vim-vue-plugin.svg?branch=master
 [13]: https://svelte.dev/
+[14]: https://github.com/leafgarland/typescript-vim
+[15]: https://github.com/HerringtonDarkholme/yats.vim
+[16]: https://github.com/iloginow/vim-stylus

_config.yml

@@ -1 +1,3 @@
-theme: jekyll-theme-cayman
+theme: jekyll-theme-cayman
+markdown: CommonMarkGhPages
+extensins: ["table"]

filetype.vim

@@ -1,9 +0,0 @@
-au BufNewFile,BufRead *.vue,*.wpy call s:setFiletype()
-
-function! s:setFiletype()
-  " enable JavaScript autocmds first
-  " let &filetype = 'javascript'
-
-  " then set filetype
-  let &filetype = 'vue'
-endfunction

ftdetect/vue.vim

@@ -0,0 +1 @@
+autocmd BufNewFile,BufRead *.vue,*.wpy set filetype=vue 

ftplugin/vue.vim

@@ -1,7 +1,9 @@
 if exists("b:did_ftplugin") | finish | endif
 let b:did_ftplugin = 1
 
-setlocal matchpairs+=<:>
+if !has('nvim')
+  setlocal matchpairs+=<:>
+endif
 
 if exists("loaded_matchit")
   let b:match_ignorecase = 1

ftplugin/vue/fold.vim

@@ -69,24 +69,35 @@ function! GetVueFold(lnum)
   endif
 
   " Fold by indent
+  if a:lnum > 1
+    let prev_indent = s:IndentLevel(a:lnum - 1)
+  else
+    let prev_indent = 0
+  endif
   let this_indent = s:IndentLevel(a:lnum)
   let next_indent = s:IndentLevel(s:NextNonBlankLine(a:lnum))
 
-  if a:lnum > 1
-    let prev_indent = s:IndentLevel(a:lnum - 1)
-
-    if this_indent < prev_indent
-      return prev_indent
+  if GetVueTag(a:lnum) == 'script'
+    " Handle closing '}'
+    if this_line =~ '\v^\s*},?\s*$'
+      return '<'.prev_indent
     endif
-  endif
 
-  if this_indent >= next_indent 
+    " --this
+    " ----next
+    if this_indent < next_indent
+      return '>'.next_indent
+    endif
+
+    " ----this
+    " --next
+    if this_indent >= next_indent 
+      return this_indent
+    endif
+  else
+    " Template or style
     return this_indent
   endif
-
-  if this_indent < next_indent
-    return '>'.next_indent
-  endif
 endfunction
 
 function! s:IndentLevel(lnum)

indent/vue.vim

@@ -23,7 +23,8 @@ let s:template_tag = '\v^\s*\<\/?template'
 let s:empty_tagname = '(area|base|br|col|embed|hr|input|img|keygen|link|meta|param|source|track|wbr)'
 let s:empty_tag = '\v\<'.s:empty_tagname.'[^/]*\>' 
 let s:empty_tag_start = '\v\<'.s:empty_tagname.'[^\>]*$' 
-let s:empty_tag_end = '\v^\s*[^\<\>\/]*\>\s*' 
+let s:empty_tag_end = '\v^\s*[^\<\>\/]*\/?\>\s*' 
+let s:tag_start = '\v^\s*\<\w*'
 let s:tag_end = '\v^\s*\/?\>\s*'
 "}}}
 
@@ -36,8 +37,12 @@ let s:use_pug = exists("g:vim_vue_plugin_use_pug")
       \ && g:vim_vue_plugin_use_pug == 1
 let s:use_sass = exists("g:vim_vue_plugin_use_sass")
       \ && g:vim_vue_plugin_use_sass == 1
+let s:use_stylus = exists("g:vim_vue_plugin_use_stylus")
+      \ && g:vim_vue_plugin_use_stylus == 1
 let s:use_coffee = exists("g:vim_vue_plugin_use_coffee")
       \ && g:vim_vue_plugin_use_coffee == 1
+let s:use_typescript = exists("g:vim_vue_plugin_use_typescript")
+      \ && g:vim_vue_plugin_use_typescript == 1
 
 let s:has_init_indent = 0
 if !exists("g:vim_vue_plugin_has_init_indent")
@@ -69,7 +74,9 @@ let b:javascript_indentexpr = &indentexpr
 
 if s:use_pug
   unlet! b:did_indent
+  let s:save_formatoptions = &formatoptions
   runtime! indent/pug.vim
+  let &formatoptions = s:save_formatoptions
 endif
 
 if s:use_sass
@@ -77,10 +84,20 @@ if s:use_sass
   runtime! indent/sass.vim
 endif
 
+if s:use_stylus
+  unlet! b:did_indent
+  runtime! indent/stylus.vim
+endif
+
 if s:use_coffee
   unlet! b:did_indent
   runtime! indent/coffee.vim
 endif
+
+if s:use_typescript
+  unlet! b:did_indent
+  runtime! indent/typescript.vim
+endif
 "}}}
 
 """""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
@@ -131,7 +148,7 @@ function! GetVueIndent()
       let [start, end] = s:PrevMultilineEmptyTag(v:lnum)
       if end == prevlnum
         call vue#Log('previous line is a multiline empty tag')
-        let ind = ind - &sw
+        let ind = indent(v:lnum - 1)
       endif
     endif
   elseif s:SynPug(cursyn)
@@ -140,9 +157,15 @@ function! GetVueIndent()
   elseif s:SynCoffee(cursyn)
     call vue#Log('syntax: coffee')
     let ind = GetCoffeeIndent(v:lnum)
+  elseif s:SynTypeScript(cursyn)
+    call vue#Log('syntax: typescript')
+    let ind = GetTypescriptIndent()
   elseif s:SynSASS(cursyn)
     call vue#Log('syntax: sass')
     let ind = GetSassIndent()
+  elseif s:SynStylus(cursyn)
+    call vue#Log('syntax: stylus')
+    let ind = GetStylusIndent()
   elseif s:SynStyle(cursyn)
     call vue#Log('syntax: style')
     let ind = GetCSSIndent()
@@ -197,8 +220,16 @@ function! s:SynCoffee(syn)
   return a:syn ==? 'coffeeVueScript'
 endfunction
 
+function! s:SynTypeScript(syn)
+  return a:syn ==? 'typescriptVueScript'
+endfunction
+
 function! s:SynSASS(syn)
-  return a:syn ==? 'cssSassVueStyle'
+  return a:syn ==? 'sassVueStyle'
+endfunction
+
+function! s:SynStylus(syn)
+  return a:syn ==? 'cssStylusVueStyle'
 endfunction
 
 function! s:SynStyle(syn)
@@ -210,17 +241,23 @@ function! s:SynVueScriptOrStyle(syn)
 endfunction
 
 function! s:PrevMultilineEmptyTag(lnum)
-  let lnum = a:lnum
+  let lnum = a:lnum - 1
   let lnums = [0, 0]
   while lnum > 0
     let line = getline(lnum)
     if line =~? s:empty_tag_end
       let lnums[1] = lnum
     endif
-    if line =~? s:empty_tag_start
-      let lnums[0] = lnum
-      return lnums
+
+    if line =~? s:tag_start
+      if line =~? s:empty_tag_start
+        let lnums[0] = lnum
+        return lnums
+      else
+        return [0, 0]
+      endif
     endif
+
     let lnum = lnum - 1
   endwhile
 endfunction
@@ -246,8 +283,12 @@ function! s:PrevNonBlacnkNonComment(lnum)
   return prevlnum
 endfunction
 
-function! GetVueTag()
-  let lnum = getcurpos()[1]
+function! GetVueTag(...)
+  if a:0 > 0
+    let lnum = a:1
+  else
+    let lnum = getcurpos()[1]
+  endif
   let cursyns = s:SynsEOL(lnum)
   let syn = get(cursyns, 0, '')
 

syntax/vue-html.vim

@@ -16,17 +16,15 @@ 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 keyword VueComponentName containedin=htmlTagN component transition slot
 
-syntax match VueAttr '\v(\S)@<![v:\@][^\=\>[:blank:]]+(\=\"[^"]*\")?' 
+syntax match VueAttr '\v(\S)@<![v:\@][^=/>[:blank:]]+(\=\"[^"]*\")?' 
       \ keepend
       \ containedin=htmlTag 
       \ contains=VueKey,VueQuote
 
-syntax match VueKey contained '\v[v:\@][^\=\>[:blank:]]+'
+syntax match VueKey contained '\v[v:\@][^=/>[:blank:]]+'
 syntax region VueQuote contained 
       \ start='"' end='"' 
       \ contains=VueValue
-syntax match VueValue contained '\v\"\zs[^"]+\ze\"'
-      \ contains=VueInject,@simpleJavascriptExpression
 
 syntax match VueInject contained '\v\$\w*'
 
@@ -65,10 +63,13 @@ syntax keyword javaScriptOperator delete instanceof typeof void new in of contai
 
 highlight default link VueAttr htmlTag
 if s:highlight_vue_attr
+  syntax match VueValue contained '\v\"\zs[^"]+\ze\"'
+        \ contains=VueInject,@simpleJavascriptExpression
   highlight default link VueKey Type
   highlight default link VueQuote VueAttr
   highlight default link VueValue None
 else
+  syntax match VueValue contained '\v\"\zs[^"]+\ze\"'
   highlight default link VueKey htmlArg
   highlight default link VueQuote String
   highlight default link VueValue String

syntax/vue.vim

@@ -26,8 +26,12 @@ let s:use_less = exists("g:vim_vue_plugin_use_less")
       \ && g:vim_vue_plugin_use_less == 1
 let s:use_sass = exists("g:vim_vue_plugin_use_sass")
       \ && g:vim_vue_plugin_use_sass == 1
+let s:use_stylus = exists("g:vim_vue_plugin_use_stylus")
+      \ && g:vim_vue_plugin_use_stylus == 1
 let s:use_coffee = exists("g:vim_vue_plugin_use_coffee")
       \ && g:vim_vue_plugin_use_coffee == 1
+let s:use_typescript = exists("g:vim_vue_plugin_use_typescript")
+      \ && g:vim_vue_plugin_use_typescript == 1
 "}}}
 
 """""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
@@ -54,6 +58,8 @@ function! s:LoadDefaultSyntax(group, type)
   endfor
 endfunction
 
+" Load all syntax files in 'runtimepath'
+" Useful if there is no default syntax file provided by vim
 function! s:LoadFullSyntax(group, type)
   call s:SetCurrentSyntax(a:type)
   execute 'syntax include '.a:group.' syntax/'.a:type.'.vim'
@@ -63,6 +69,8 @@ endfunction
 function! s:SetCurrentSyntax(type)
   if a:type == 'coffee'
     syntax cluster coffeeJS contains=@htmlJavaScript
+
+    " Avoid overload of `javascript.vim`
     let b:current_syntax = 'vue'
   else
     unlet! b:current_syntax
@@ -75,13 +83,14 @@ endfunction
 " Load main syntax {{{
 "
 """""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
-" Load syntax/*.vim to syntax group
+" Load syntax/html.vim to syntax group, which loads full JavaScript and CSS
+" syntax. It defines group htmlJavaScript and htmlCss.
 call s:LoadSyntax('@HTMLSyntax', 'html')
 
 " Load vue-html syntax
 runtime syntax/vue-html.vim
 
-" Avoid overload. 'syntax/html.vim' defines htmlCss and htmlJavaScript
+" Avoid overload.
 if hlexists('cssTagName') == 0
   call s:LoadSyntax('@htmlCss', 'css')
 endif
@@ -101,6 +110,7 @@ endif
 " If pug is enabled, load vim-pug syntax
 if s:use_pug
   call s:LoadFullSyntax('@PugSyntax', 'pug')
+  syn cluster htmlJavascript remove=javascriptParenthesisBlock
 endif
 
 " If less is enabled, load less syntax 
@@ -115,11 +125,22 @@ if s:use_sass
   runtime! after/syntax/sass.vim
 endif
 
+" If stylus is enabled, load stylus syntax 
+if s:use_stylus
+  call s:LoadFullSyntax('@StylusSyntax', 'stylus')
+  runtime! after/syntax/stylus.vim
+endif
+
 " If CoffeeScript is enabled, load the syntax. Keep name consistent with
 " vim-coffee-script/after/html.vim
 if s:use_coffee
   call s:LoadFullSyntax('@htmlCoffeeScript', 'coffee')
 endif
+
+" If TypeScript is enabled, load the syntax.
+if s:use_typescript
+  call s:LoadFullSyntax('@TypeScript', 'typescript')
+endif
 "}}}
 
 """""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
@@ -135,7 +156,7 @@ syntax region htmlVueTemplate fold
 " When template code is not well indented
 syntax region htmlVueTemplate fold
       \ start=+<template[^>]*>+
-      \ end=+</template>\ze\n\(^$\n\)*<script>+
+      \ end=+</template>\ze\n\(^$\n\)*<\(script\|style\)+
       \ keepend contains=@HTMLSyntax
 
 syntax region javascriptVueScript fold 
@@ -143,6 +164,7 @@ syntax region javascriptVueScript fold
       \ end=+</script>+
       \ keepend contains=@htmlJavaScript,jsImport,jsExport,vueTag
 
+
 syntax region cssVueStyle fold
       \ start=+<style[^>]*>+
       \ end=+</style>+
@@ -150,38 +172,48 @@ syntax region cssVueStyle fold
 
 " Preprocessors syntax
 syntax region pugVueTemplate fold
-      \ start=+<template[^>]*lang="pug"[^>]*>+
+      \ start=+<template[^>]*lang=["']pug["'][^>]*>+
       \ end=+</template>+
       \ keepend contains=@PugSyntax,vueTag
 
 syntax region coffeeVueScript fold 
-      \ start=+<script[^>]*lang="coffee"[^>]*>+
+      \ start=+<script[^>]*lang=["']coffee["'][^>]*>+
       \ end=+</script>+
       \ keepend contains=@htmlCoffeeScript,jsImport,jsExport,vueTag
 
+syntax region typescriptVueScript fold
+      \ start=+<script[^>]*lang=["']ts["'][^>]*>+
+      \ end=+</script>+
+      \ keepend contains=@TypeScript,vueTag
+
 syntax region cssLessVueStyle fold
-      \ start=+<style[^>]*lang="less"[^>]*>+
+      \ start=+<style[^>]*lang=["']less["'][^>]*>+
       \ end=+</style>+
       \ keepend contains=@LessSyntax,vueTag
-syntax region cssSassVueStyle fold
-      \ start=+<style[^>]*lang="sass"[^>]*>+
+syntax region sassVueStyle fold
+      \ start=+<style[^>]*lang=["']sass["'][^>]*>+
       \ end=+</style>+
       \ keepend contains=@SassSyntax,vueTag
 syntax region cssScssVueStyle fold
-      \ start=+<style[^>]*lang="scss"[^>]*>+
+      \ start=+<style[^>]*lang=["']scss["'][^>]*>+
       \ end=+</style>+
       \ keepend contains=@SassSyntax,vueTag
+syntax region cssStylusVueStyle fold
+      \ start=+<style[^>]*lang=["']stylus["'][^>]*>+
+      \ end=+</style>+
+      \ keepend contains=@StylusSyntax,vueTag
 
 syntax region vueTag fold
       \ start=+^<[^/]+ end=+>+ skip=+></+
       \ contained contains=htmlTagN,htmlString,htmlArg
 syntax region vueTag 
       \ start=+^</+ end=+>+
-      \ contained contains=htmlTagN,htmlString,htmlArg
+      \ contains=htmlTagN,htmlString,htmlArg
 
 highlight default link vueTag htmlTag
 highlight default link cssUnitDecorators2 Number
 highlight default link cssKeyFrameProp2 Constant
+
 "}}}
 
 """""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
@@ -201,7 +233,7 @@ else
 endif
 
 " Style
-" Redefine (less|sass)Definition to highlight <style> correctly and 
+" Redefine (less|sass|stylus)Definition to highlight <style> correctly and 
 " enable emmet-vim css type.
 if s:use_less
   silent! syntax clear lessDefinition
@@ -212,7 +244,13 @@ endif
 if s:use_sass
   silent! syntax clear sassDefinition
   syntax region cssSassDefinition matchgroup=cssBraces contains=@SassSyntax 
-        \ contained containedin=cssSassVueStyle,cssScssVueStyle
+        \ contained containedin=sassVueStyle,cssScssVueStyle
+        \ start="{" end="}" 
+endif
+if s:use_stylus
+  silent! syntax clear stylusDefinition
+  syntax region cssStylusDefinition matchgroup=cssBraces contains=@StylusSyntax 
+        \ contained containedin=cssStylusVueStyle
         \ start="{" end="}" 
 endif
 
@@ -222,12 +260,12 @@ silent! syntax clear cssUnitDecorators
 syntax match cssUnitDecorators2 
       \ /\(#\|-\|+\|%\|mm\|cm\|in\|pt\|pc\|em\|ex\|px\|ch\|rem\|vh\|vw\|vmin\|vmax\|dpi\|dppx\|dpcm\|Hz\|kHz\|s\|ms\|deg\|grad\|rad\)\ze\(;\|$\)/
       \ contained
-      \ containedin=cssAttrRegion,sassCssAttribute,lessCssAttribute
+      \ containedin=cssAttrRegion,sassCssAttribute,lessCssAttribute,stylusCssAttribute
 
 silent! syntax clear cssKeyFrameProp
 syn match cssKeyFrameProp2 /\d*%\|from\|to/ 
       \ contained nextgroup=cssDefinition
-      \ containedin=cssAttrRegion,sassCssAttribute,lessCssAttribute
+      \ containedin=cssAttrRegion,sassCssAttribute,lessCssAttribute,stylusCssAttribute
 
 " Coffee
 if s:use_coffee
@@ -249,5 +287,25 @@ silent! syntax clear htmlHead
 syntax match htmlArg '\v<data(-[.a-z0-9]+)+>' containedin=@HTMLSyntax
 "}}}
 
+"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
+"
+" Syntax sync {{{
+"
+"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
+syntax sync clear
+syntax sync minlines=10
+syntax sync match vueHighlight groupthere NONE "</\(script\|template\|style\)"
+syntax sync match scriptHighlight groupthere javascriptVueScript "<script"
+syntax sync match scriptHighlight groupthere coffeeVueScript "<script[^>]*lang=["']coffee["'][^>]*>"
+syntax sync match scriptHighlight groupthere typescriptVueScript "<script[^>]*lang=["']ts["'][^>]*>"
+syntax sync match templateHighlight groupthere htmlVueTemplate "<template"
+syntax sync match templateHighlight groupthere pugVueTemplate "<template[^>]*lang=["']pug["'][^>]*>"
+syntax sync match styleHighlight groupthere cssVueStyle "<style"
+syntax sync match styleHighlight groupthere cssLessVueStyle "<style[^>]*lang=["']less["'][^>]*>"
+syntax sync match styleHighlight groupthere sassVueStyle "<style[^>]*lang=["']sass["'][^>]*>"
+syntax sync match styleHighlight groupthere cssScssVueStyle "<style[^>]*lang=["']scss["'][^>]*>"
+syntax sync match styleHighlight groupthere cssStylusVueStyle "<style[^>]*lang=["']stylus["'][^>]*>"
+"}}}
+
 let b:current_syntax = 'vue'
 " vim: fdm=marker