Add skeleton stylus support

README.md

@@ -44,7 +44,7 @@ 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], TypeScript with [typescript-vim][14] or [yats.vim][15].^
+- 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].
@@ -65,6 +65,7 @@ Set global variable to `1` to enable or `0` to disable. Ex:
 | `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_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 |
@@ -149,3 +150,4 @@ This plugin is under [The Unlicense][8]. Other than this, `lib/indent/*` files a
 [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

indent/vue.vim

@@ -37,6 +37,8 @@ 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")
@@ -82,6 +84,11 @@ 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
@@ -156,6 +163,9 @@ function! GetVueIndent()
   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()
@@ -218,6 +228,10 @@ function! s:SynSASS(syn)
   return a:syn ==? 'cssSassVueStyle'
 endfunction
 
+function! s:SynStylus(syn)
+  return a:syn ==? 'cssStylusVueStyle'
+endfunction
+
 function! s:SynStyle(syn)
   return a:syn =~? 'VueStyle'
 endfunction

syntax/vue.vim

@@ -26,6 +26,8 @@ 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")
@@ -121,6 +123,12 @@ if s:use_sass
   runtime! after/syntax/sass.vim
 endif
 
+" If stylus is enabled, load stylus syntax 
+if s:use_stylus
+  call s:LoadSyntax('@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
@@ -188,6 +196,10 @@ syntax region cssScssVueStyle fold
       \ 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=+></+
@@ -219,7 +231,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
@@ -233,6 +245,12 @@ if s:use_sass
         \ contained containedin=cssSassVueStyle,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
 
 " Avoid css syntax interference
 silent! syntax clear cssUnitDecorators
@@ -240,12 +258,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
@@ -284,6 +302,7 @@ syntax sync match styleHighlight groupthere cssVueStyle "<style"
 syntax sync match styleHighlight groupthere cssLessVueStyle "<style[^>]*lang=["']less["'][^>]*>"
 syntax sync match styleHighlight groupthere cssSassVueStyle "<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'