vimでvue.jsのsyntax highlightを設定した

Date

タイトルの通り。
vimでvue.jsを扱う為に、syntax highlightを設定した。

前提/環境

  • vim8.1
  • macOS Mojave

使用プラグイン

今回使ったのは、

posva/vim-vueだ。

プラグイン管理にはdeinを使っているので、
.vimrcに以下を追加した。 

call dein#add('posva/vim-vue')

とても簡単。

その他の設定

ファイルの途中からsyntaxが効かなくなることがあるらしいので、 

autocmd FileType vue syntax sync fromstart

を追加。

合わせて、1つのvueファイル内にHTML/CSS/JavaScriptを書くので、 

let g:ft = ''
function! NERDCommenter_before()
  if &ft == 'vue'
    let g:ft = 'vue'
    let stack = synstack(line('.'), col('.'))
    if len(stack) > 0
      let syn = synIDattr((stack)[0], 'name')
      if len(syn) > 0
        exe 'setf ' . substitute(tolower(syn), '^vue_', '', '')
      endif
    endif
  endif
endfunction
function! NERDCommenter_after()
  if g:ft == 'vue'
    setf vue
    let g:ft = ''
  endif
endfunction

を追加。

*.vueファイルにのみ効かせる為に、/.vim/indent/vue.vimを新規作成して、そこに追加。

実際のdotfile群は、
yamachaaan/dotfilesにある。