Syntax highlighting

[juancabrera]

Really tried to figure out what is wrong before posting this, so sorry in advance.

I started from scratch a new Vim configuration but now the .vue files are not being highlighted. Thought it could be a plugin incompatibility and tried removing/adding all syntax related plugins with not success. Also :syntax sync fromstart didn't work.

I'm using VIM - Vi IMproved 7.4 and this is my .vimrc conf:

 ---------------------- USABILITY CONFIGURATION ----------------------
"  Basic and pretty much needed settings to provide a solid base for
"  source code editting

" don't make vim compatible with vi
set nocompatible

" turn on syntax highlighting
syntax on

" and show line numbers
set number

" make vim try to detect file types and load plugins for them
filetype on
filetype plugin on
filetype indent on

" reload files changed outside vim
set autoread

" encoding is utf 8
set encoding=utf-8
set fileencoding=utf-8

" enable matchit plugin which ships with vim and greatly enhances '%'
runtime macros/matchit.vim

" by default, in insert mode backspace won't delete over line breaks, or
" automatically-inserted indentation, let's change that
set backspace=indent,eol,start

" dont't unload buffers when they are abandoned, instead stay in the
" background
set hidden

" set unix line endings
set fileformat=unix
" when reading files try unix line endings then dos, also use unix for new
" buffers
set fileformats=unix,dos

" save up to 100 marks, enable capital marks
set viminfo='100,f1

" screen will not be redrawn while running macros, registers or other
" non-typed comments
set lazyredraw

" ---------------------- CUSTOMIZATION ----------------------
" set , as mapleader
" let mapleader = ","

" save with ctrl+s
nmap <c-s> :w<CR>
imap <c-s> <Esc>:w<CR>a

" hide unnecessary gui in gVim
if has("gui_running")
    set guioptions-=m  " remove menu bar
    set guioptions-=T  " remove toolbar
    set guioptions-=r  " remove right-hand scroll bar
    set guioptions-=L  " remove left-hand scroll bar
end

" allow Tab and Shift+Tab to
" tab  selection in visual mode
vmap <Tab> >gv
vmap <S-Tab> <gv

" suggestion for normal mode commands
set wildmode=list:longest

" keep the cursor visible within 3 lines when scrolling
set scrolloff=3

" indentation
set expandtab       " use spaces instead of tabs
set autoindent      " autoindent based on line above, works most of the time
set smartindent     " smarter indent for C-like languages
set shiftwidth=2    " when reading, tabs are 4 spaces
set softtabstop=2   " in insert mode, tabs are 4 spaces

" ---------------------- PLUGIN CONFIGURATION ----------------------
" initiate Vundle
let &runtimepath.=',$HOME/.vim/bundle/Vundle.vim'
call vundle#begin()
" let Vundle manage Vundle, required
Plugin 'gmarik/Vundle.vim'

" start plugin defintion
Plugin 'pangloss/vim-javascript'
Bundle 'jelera/vim-javascript-syntax'
Plugin 'othree/yajs.vim'
Plugin 'othree/es.next.syntax.vim'
Plugin 'mxw/vim-jsx'
Plugin 'elzr/vim-json'
Plugin 'isRuslan/vim-es6'
Plugin 'posva/vim-vue'
Plugin 'scrooloose/nerdtree'
Plugin 'vim-scripts/L9'
Plugin 'tpope/vim-fugitive'
Plugin 'git://git.wincent.com/command-t.git'
Plugin 'rstacruz/sparkup', {'rtp': 'vim/'}
Plugin 'vim-scripts/FuzzyFinder'
Plugin 'itchyny/lightline.vim'
Plugin 'Lokaltog/vim-easymotion'
Plugin 'tpope/vim-surround'
Plugin 'Shutnik/jshint2.vim'
Plugin 'skammer/vim-css-color'
Plugin 'hail2u/vim-css3-syntax'
Plugin 'scrooloose/syntastic'
Bundle 'kien/ctrlp.vim'
Bundle "tpope/vim-rails.git"
Bundle 'altercation/vim-colors-solarized'
Bundle "bling/vim-airline.git"
Bundle "vim-scripts/TagHighlight.git"
Bundle "jtratner/vim-flavored-markdown.git"
Bundle "nelstrom/vim-markdown-preview"
Bundle "skwp/vim-conque"
Plugin 'reewr/vim-monokai-phoenix'
Plugin 'sheerun/vim-polyglot'

" end plugin definition
call vundle#end()

" Color theme
colorscheme monokai-phoenix

" start NERDTree on start-up and focus active window
autocmd VimEnter * NERDTree
autocmd VimEnter * wincmd p

" map FuzzyFinder
noremap <leader>b :FufBuffer<cr>
noremap <leader>f :FufFile<cr>

" run JSHint when a file with .js extension is saved
" this requires the jsHint2 plugin
autocmd BufWritePost *.js silent :JSHint

Please let me know if you see something weird so I can try. Thanks!

[posva]

looks like you're missing setting the filetype to vue. Open a new file and test with :set ft=vue (this is done by the plugin automatically, no clue why it doesn't work, you may have something erasing that conf. Maybe move the plugin to the end of the list)

[juancabrera]

@posva yeah, that did the trick. But now how can I fix this on .vimrc not sure how to do it.

Thanks!

[posva]

you should add something like au BufNewFile,BufRead *.vue setf vue but this should be added by the plugin already, I believe

[fiatjaf]

I don't know if the problem here is the same as mine. I don't even know what is the expected behavior of vim-vue. But here's what I got:

Should my JS be so poorly highlighted? That is what always happened with my .html files. I've tried running :set ft=vue and :syntax sync fromstart, but nothing has changed.

My .vimrc: https://github.com/fiatjaf/dotfiles/blob/6827501b16253da63b5c64e17d29c34812326b4d/vimrc

[LikitSaeLee]

@fiatjaf It is resolved in this PR: https://github.com/posva/vim-vue/pull/88/files

you might want to use the author's branch before the PR is merged in.

[yusunglee2074]

@posva Hi. I recognize " au BufNewFile,BufRead *.vue setf vue" not place on filetype.vim

And I manually insert that line. It work.

Can I ask to why? (Several time re-install..)

I use ubuntu 16.04.

Plz give me a little idia.. thankyou.

[posva]

It is in ftdetect. Regarding the issue, there's a PR for it but it needs a bit more work. @adriaanzon will take a look when he can, please be patient 🙂

[adriaanzon]

@yusunglee2074 How did you install vim-vue?

[adriaanzon]

I will look further at this issue soon. I still need to reproduce it too...

[joemsak]

@posva Having a similar issue here, vim installed via thoughtbot's laptop script, .vimrc managed via thoughtbot dotfiles with .local overrides, vim-vue installed via vim-plug

My issue is the highlighting just disappears while I'm working. When I type :syntax sync fromstart it comes back. If I type :set ft=vue it goes bland again.

thoughtbot vimrc https://github.com/thoughtbot/dotfiles/blob/master/vimrc

my appended vimrc https://github.com/joemsak/dotfiles-local/blob/master/vimrc.local

thoutbot plugins: https://github.com/thoughtbot/dotfiles/blob/master/vimrc.bundles

my plugins appended https://github.com/joemsak/dotfiles-local/blob/master/vimrc.bundles.local

[moonhead]

I was seeing intermittent loss of syntax highlighting. The command mentioned above has solved it for me. :syntax sync fromstart

[jannooo]

I am experiencing the same issue. I installed vim-vue with vundle and I am not getting any syntax highlighting for .vue files unless I add au BufNewFile,BufRead *.vue setf vue to my .vimrc.

• Mac OS
• VIM - Vi IMproved 8.1 (2018 May 17, compiled Jun 13 2018 07:24:23)

[MaraniMatias]

I had the same problem.

My solution:

  let g:vue_disable_pre_processors=1
  autocmd FileType vue syntax sync fromstart
  autocmd BufRead,BufNewFile *.vue setlocal filetype=vue.html.javascript.css.less.pug

Find what plugin was interested in vim-vue. Delete all the plugins and reinstalled them checking that vie-vue will work fine.

[seeya]

Same issue on Mac OS, added au BufNewFile,BufRead *.vue setf vue to my ~/.vimrc, restarted vim and it worked.

[pattrickrice]

I'm not super familiar with the implementation of plugins, but is it possible to either run that command on install, or just include it in the README?

[adriaanzon]

@pattrickrice It should already be handled by this ftdetect file https://github.com/posva/vim-vue/blob/master/ftdetect/vue.vim, but for some reason it doesn't work for some people. No idea why, for me it works out of the box.

[adriaanzon]

The latest version of Vim (patch 8.1.1762 to be precise) has added the ftdetect autocmd to their filetype.vim. I think that should solve it in places where it didn't work out of the box. Can anyone who had this issue confirm?

[fulopkovacs]

The latest version of Vim (patch 8.1.1762 to be precise) has added the ftdetect autocmd to their filetype.vim. I think that should solve it in places where it didn't work out of the box. Can anyone who had this issue confirm?

👍 Yes, updating Vim solved the highlighting issues for me. Thanks for the tip!

[acidjazz]

my problem is my filetype is being set to vuejs , not vue

[acidjazz]

my solution was to add this to my .vimrc

autocmd BufRead,BufNewFile *.vue setlocal filetype=vue

[adriaanzon]

@acidjazz on which version of vim are you? They changed it from vuejs to vue in a later release

[acidjazz]

@adriaanzon