mirror of
https://github.com/leafOfTree/vim-vue-plugin.git
synced 2025-12-10 22:51:52 +08:00
feat: improve performance
This commit is contained in:
16
README.md
16
README.md
@@ -22,16 +22,20 @@ Vim syntax and indent plugin for `.vue` files. Mainly inspired by [mxw/vim-jsx][
|
|||||||
|
|
||||||
set rpt+=path/to/this_plugin
|
set rpt+=path/to/this_plugin
|
||||||
|
|
||||||
Plugin works if filetype is set to `javascript.vue`. Please stay up to date. Feel free to open an issue or a pull request.
|
Plugin works if `filetype` is set to `vue`. Please stay up to date. Feel free to open an issue or a pull request.
|
||||||
|
|
||||||
|
**Note**: `filetype` used to be `javascript.vue`, which caused `javascript`syntax to be loaded multiple times and a significant delay. Now `filetype` is set to `vue` and autocmds for `javascript` have to be manually added for `vue`.
|
||||||
|
|
||||||
## How it works
|
## How it works
|
||||||
|
|
||||||
Since `.vue` is a combination of CSS, HTML and JavaScript, so is `vim-vue-plugin`. (Like XML and JavaScript for `.jsx`).
|
Since `.vue` is a combination of CSS, HTML and JavaScript, so is `vim-vue-plugin`. (Like XML and JavaScript for `.jsx`).
|
||||||
|
|
||||||
- Support Pug(`<template lang="pug">`) with [vim-pug][4] (see Configuration).
|
Supports
|
||||||
- Support Less(`<style lang="less">`) with or without [vim-less][9] (see Configuration).
|
|
||||||
- Support Sass/Scss(`<style lang="sass(or scss)">`) (see Configuration).
|
- Pug with [vim-pug][4] (see Configuration).
|
||||||
- Support `.wpy` files from [WePY][6]
|
- Less with or without [vim-less][9] (see Configuration).
|
||||||
|
- Sass/Scss (see Configuration).
|
||||||
|
- `.wpy` files from [WePY][6]
|
||||||
|
|
||||||
## Configuration
|
## Configuration
|
||||||
|
|
||||||
@@ -47,7 +51,7 @@ 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 indent errors occur. | 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` |
|
||||||
|
|
||||||
\*: Vim may be slow if the feature is enabled. Find 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 balance between syntax highlight and speed. By the way, custom syntax could be added in `~/.vim/syntax` or `$VIM/vimfiles/syntax`.
|
||||||
|
|||||||
@@ -1,11 +1,11 @@
|
|||||||
au BufNewFile,BufRead *.vue,*.wpy call s:setFiletype()
|
au BufNewFile,BufRead *.vue,*.wpy call s:setFiletype()
|
||||||
|
|
||||||
function! s:setFiletype()
|
function! s:setFiletype()
|
||||||
" enable javascript autocmds first
|
" enable JavaScript autocmds first
|
||||||
let &filetype = 'javascript'
|
" let &filetype = 'javascript'
|
||||||
|
|
||||||
" then set filetype
|
" then set filetype
|
||||||
let &filetype = 'javascript.vue'
|
let &filetype = 'vue'
|
||||||
endfunction
|
endfunction
|
||||||
|
|
||||||
if !exists("g:vim_vue_plugin_has_init_indent")
|
if !exists("g:vim_vue_plugin_has_init_indent")
|
||||||
|
|||||||
@@ -14,7 +14,6 @@ endif
|
|||||||
se sw=2 ts=2
|
se sw=2 ts=2
|
||||||
|
|
||||||
let s:name = 'vim-vue-plugin'
|
let s:name = 'vim-vue-plugin'
|
||||||
|
|
||||||
let s:debug = exists("g:vim_vue_plugin_debug")
|
let s:debug = exists("g:vim_vue_plugin_debug")
|
||||||
\ && g:vim_vue_plugin_debug == 1
|
\ && g:vim_vue_plugin_debug == 1
|
||||||
let s:use_pug = exists("g:vim_vue_plugin_use_pug")
|
let s:use_pug = exists("g:vim_vue_plugin_use_pug")
|
||||||
@@ -24,8 +23,9 @@ let s:use_sass = exists("g:vim_vue_plugin_use_sass")
|
|||||||
let s:has_init_indent = exists("g:vim_vue_plugin_has_init_indent")
|
let s:has_init_indent = exists("g:vim_vue_plugin_has_init_indent")
|
||||||
\ && g:vim_vue_plugin_has_init_indent == 1
|
\ && g:vim_vue_plugin_has_init_indent == 1
|
||||||
|
|
||||||
" Let <template> be handled by HTML indent
|
" Let <template> handled by HTML indent
|
||||||
let s:vue_tag = '\v^\<(script|style)'
|
let s:vue_tag = '\v^\<(script|style)'
|
||||||
|
|
||||||
let s:vue_end_tag = '\v\<\/(template|script|style)'
|
let s:vue_end_tag = '\v\<\/(template|script|style)'
|
||||||
let s:end_tag = '^\s*\/\?>\s*'
|
let s:end_tag = '^\s*\/\?>\s*'
|
||||||
|
|
||||||
|
|||||||
@@ -20,6 +20,14 @@ let s:use_less = exists("g:vim_vue_plugin_use_less")
|
|||||||
let s:use_sass = exists("g:vim_vue_plugin_use_sass")
|
let s:use_sass = exists("g:vim_vue_plugin_use_sass")
|
||||||
\ && g:vim_vue_plugin_use_sass == 1
|
\ && g:vim_vue_plugin_use_sass == 1
|
||||||
|
|
||||||
|
function! s:LoadSyntax(group, type)
|
||||||
|
if s:load_full_syntax
|
||||||
|
call s:LoadFullSyntax(a:group, a:type)
|
||||||
|
else
|
||||||
|
call s:LoadDefaultSyntax(a:group, a:type)
|
||||||
|
endif
|
||||||
|
endfunction
|
||||||
|
|
||||||
function! s:LoadDefaultSyntax(group, type)
|
function! s:LoadDefaultSyntax(group, type)
|
||||||
unlet! b:current_syntax
|
unlet! b:current_syntax
|
||||||
exec 'syn include '.a:group.' $VIMRUNTIME/syntax/'.a:type.'.vim'
|
exec 'syn include '.a:group.' $VIMRUNTIME/syntax/'.a:type.'.vim'
|
||||||
@@ -32,25 +40,29 @@ function! s:LoadFullSyntax(group, type)
|
|||||||
exec 'syn include '.a:group.' syntax/'.a:type.'.vim'
|
exec 'syn include '.a:group.' syntax/'.a:type.'.vim'
|
||||||
endfunction
|
endfunction
|
||||||
|
|
||||||
|
"""""""""""""""""""""""""""""""""""""""""""""""
|
||||||
|
"
|
||||||
|
" Main
|
||||||
|
"
|
||||||
|
"""""""""""""""""""""""""""""""""""""""""""""""
|
||||||
" Load syntax/*.vim to syntax group
|
" Load syntax/*.vim to syntax group
|
||||||
if s:load_full_syntax
|
call s:LoadSyntax('@HTMLSyntax', 'html')
|
||||||
call s:LoadFullSyntax('@HTMLSyntax', 'html')
|
|
||||||
call s:LoadFullSyntax('@CSSSyntax', 'css')
|
|
||||||
|
|
||||||
" Load javascript syntax file as syntax group if
|
" Avoid overload
|
||||||
" pangloss/vim-javascript is not used
|
if hlexists('cssTagName') == 0
|
||||||
if hlexists('jsNoise') == 0
|
call s:LoadSyntax('@htmlCss', 'css')
|
||||||
call s:LoadFullSyntax('@jsAll', 'javascript')
|
|
||||||
endif
|
|
||||||
else
|
|
||||||
call s:LoadDefaultSyntax('@HTMLSyntax', 'html')
|
|
||||||
call s:LoadDefaultSyntax('@CSSSyntax', 'css')
|
|
||||||
if hlexists('jsNoise') == 0
|
|
||||||
call s:LoadDefaultSyntax('@jsAll', 'javascript')
|
|
||||||
endif
|
|
||||||
endif
|
endif
|
||||||
|
|
||||||
|
" Avoid overload
|
||||||
|
if hlexists('jsNoise') == 0
|
||||||
|
call s:LoadSyntax('@jsAll', 'javascript')
|
||||||
|
endif
|
||||||
|
|
||||||
|
"""""""""""""""""""""""""""""""""""""""""""""""
|
||||||
|
"
|
||||||
|
" pre-processors
|
||||||
|
"
|
||||||
|
"""""""""""""""""""""""""""""""""""""""""""""""
|
||||||
" If pug is enabled, load vim-pug syntax
|
" If pug is enabled, load vim-pug syntax
|
||||||
if s:use_pug
|
if s:use_pug
|
||||||
call s:LoadFullSyntax('@PugSyntax', 'pug')
|
call s:LoadFullSyntax('@PugSyntax', 'pug')
|
||||||
@@ -58,12 +70,12 @@ endif
|
|||||||
|
|
||||||
" If sass is enabled, load sass syntax
|
" If sass is enabled, load sass syntax
|
||||||
if s:use_sass
|
if s:use_sass
|
||||||
call s:LoadFullSyntax('@SassSyntax', 'sass')
|
call s:LoadSyntax('@SassSyntax', 'sass')
|
||||||
endif
|
endif
|
||||||
|
|
||||||
" If less is enabled, load less syntax
|
" If less is enabled, load less syntax
|
||||||
if s:use_less
|
if s:use_less
|
||||||
call s:LoadFullSyntax('@LessSyntax', 'less')
|
call s:LoadSyntax('@LessSyntax', 'less')
|
||||||
endif
|
endif
|
||||||
|
|
||||||
if s:use_sass || s:use_less
|
if s:use_sass || s:use_less
|
||||||
@@ -75,6 +87,7 @@ if s:use_sass || s:use_less
|
|||||||
\ end="}"
|
\ end="}"
|
||||||
endif
|
endif
|
||||||
|
|
||||||
|
|
||||||
let b:current_syntax = 'vue'
|
let b:current_syntax = 'vue'
|
||||||
|
|
||||||
" Find tag <template> / <script> / <style> and enable currespond syntax
|
" Find tag <template> / <script> / <style> and enable currespond syntax
|
||||||
@@ -95,7 +108,7 @@ syn region vueScript
|
|||||||
syn region vueStyle
|
syn region vueStyle
|
||||||
\ start=+<style\(\s.\{-}\)\?>+
|
\ start=+<style\(\s.\{-}\)\?>+
|
||||||
\ end=+</style>+
|
\ end=+</style>+
|
||||||
\ keepend contains=@CSSSyntax,vueTag
|
\ keepend contains=@htmlCss,vueTag
|
||||||
syn region vueStyleLESS
|
syn region vueStyleLESS
|
||||||
\ start=+<style lang="less"\(\s.\{-}\)\?>+
|
\ start=+<style lang="less"\(\s.\{-}\)\?>+
|
||||||
\ end=+</style>+
|
\ end=+</style>+
|
||||||
|
|||||||
Reference in New Issue
Block a user