posva / vim-vue

Syntax Highlight for Vue.js components
MIT License
1.29k stars 103 forks source link

Syntax not showing on NeoVim with GruvBox Theme #153

Open sc-laurence opened 3 years ago

sc-laurence commented 3 years ago

This is my current init.vim for NVIM v0.4.4

syntax on
filetype plugin indent on

set ruler " show the line and column number of the cursor.
set exrc
set textwidth=0 " Hard-wrap long lines as you type them.
set modeline 
set guicursor=
set relativenumber
set nohlsearch
set hidden
set noerrorbells
set tabstop=4 softtabstop=4
set shiftwidth=4
set expandtab
set smartindent
set nu
set nowrap
set smartcase
set noswapfile
set nobackup
set undodir=~/.config/nvim/undodir
set undofile
set incsearch
set scrolloff=8
set showmode
set completeopt=menuone,noinsert,noselect
set signcolumn=yes
set nocompatible
set cursorline
" Give more space for displaying messages.
set cmdheight=2

" Having longer updatetime (default is 4000 ms) leads to noticeable
" delays and poor user experience
set updatetime=50

" Don't pass messages to |ins-completion-menu|.
set shortmess+=c

set colorcolumn=100

call plug#begin(stdpath("data").'/plugged')
Plug 'morhetz/gruvbox'
Plug 'sheerun/vim-polyglot'
Plug 'preservim/nerdtree'
Plug 'preservim/nerdcommenter'
Plug 'frazrepo/vim-rainbow'
Plug 'jiangmiao/auto-pairs'
Plug 'mileszs/ack.vim'
Plug 'terryma/vim-multiple-cursors'
Plug 'itchyny/lightline.vim'
Plug 'airblade/vim-gitgutter'
Plug 'tpope/vim-fugitive'
Plug 'mattn/emmet-vim'
Plug 'neoclide/coc.nvim', {'branch': 'release'}
Plug 'posva/vim-vue'
call plug#end()
let g:vue_pre_processors = 'detect_on_enter'

" autocmd BufRead,BufNewFile *.vue setlocal filetype=vue
" autocmd FileType vue syntax sync fromstart
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

set termguicolors
colorscheme gruvbox
let g:rainbow_active = 1

" key mapping
nmap mo :NERDTreeToggle<CR>

but them it looks like this when I open vue files from NERDtree Screen Shot 2020-12-12 at 11 39 32 PM

the type of file has been set to Vue already, is there anything else I am doing wrong?

adriaanzon commented 3 years ago

Same issue as #135. html.vim thinks it's a <b> tag. You can currently work around it by setting the following in your init.vim:

let g:html_no_rendering = 1
sc-laurence commented 3 years ago

Thanks @adriaanzon but no joy. Do I need to add it before, within or after the plugin section? Sorry kinda new to vim

adriaanzon commented 3 years ago

Hmm, can you add screenshots of how the syntax coloring looks in individual html, js and css files?

sc-laurence commented 3 years ago

Screen Shot 2020-12-14 at 10 17 15 AM Screen Shot 2020-12-14 at 10 17 30 AM Screen Shot 2020-12-14 at 10 20 56 AM

ttcremers commented 3 years ago

This is probably caused by your vim-polyglot plugin. I had the same issue (and many more) when I used vim-polyglot.

I use per language syntax plugins now or just the ones that come with Vim. The Vue related syntax plugins that work well for me in combination with posva/vim-vue are:

" Syntax: html
Plug 'othree/html5.vim'

" Syntax: Javascript
Plug 'yuezk/vim-js'

" Syntax: scss
Plug 'cakebaker/scss-syntax.vim'

" Syntax: Vue
Plug 'posva/vim-vue'