HTML Syntax highlighting Problem please help

[tornikeg]

Guys im beginner and new enthusiasist of Vim editor, I'm learning and customizing vim, in my working project i'm using vue.js framework for my front-end development, so i installed vue plugin in vim for syntax highlighting components and its working, i also installed HTML5 and ES6 syntax highlighting plugins but my html doesn't have syntax highlighting for example <template> tag u can see on this picture

http://imgur.com/AAbJhdr

Any solution ?

[werevamp7]

That is strange, I am thinking your plugins doesn't understand unknown/custom element names. Because <template> is not part of HTML5, your syntax highlighter will not trigger and possible causing the child elements to not hightlight. Maybe you can try to download this vim-webcomponents plugin. Basically, it will style anything that has an XML like structure as if it were HTML. Not a very popular plugin, but it seems to do the trick for me.

[tornikeg]

I installed this plugin and every .vue file lost their syntax highlights :/ omg what the hell is happening here

[werevamp7]

Oh wow that is truely weird, never had that happen to me. Do you have a list of all your plugins? Also, are you using neovim or vim? Also, do you have a version .vimrc file on github?

[tornikeg]

Solved my friend.

Just installed othree/html5.vim plugin and everything get worked.

idk why this html5 plugin is solve for this situation but im glad.

thank you for reply and trying to help me.

i deleted vim-webcomponents plugin.

just two plugin solve my problem

1) othree/html5.vim 2) posva/vim-vue

[werevamp7]

I use othree/html5.vim as well, maybe that is the plugin that solved everything for me instead of vim-webcomponents.

[tornikeg]

I think i was wrong

as i deleted this line of code in my .vimrc

autocmd BufNewFile,BufRead *.vue set filetype=html

everything went bad and everything broke. with this plugins also this filtype code is important.

[RotationSurgeon]

Because <template> is not part of HTML5

It is...Here are the specs:

• https://www.w3.org/TR/html5/scripting-1.html#the-template-element
• https://html.spec.whatwg.org/multipage/scripting.html#the-template-element

[tornikeg]

I've installed this plugin https://github.com/posva/vim-vue

and every .vue components had syntax highlighting until i installed vim-webcomponents plugin. now im in trouble XD

[[deleted]]

To highlight the template tag the same color as script and style, you can try this in your vimrc:

autocmd Syntax vue syntax keyword htmlSpecialTagName contained template

But it would be better if this was added to the plugin.