Make Vim correctly highlight script type="text/html"

Question

How can I get Vim to correctly syntax-highlight in a situation such as this (used, e.g. with Knockout templates):

<script type="text/html" id="my-template">
  <!-- This should be rendered as HTML -->
  <div>Some template</div>
</script>

<script>
  //This should be rendered as Javascript
  var x = function() { return 3; }
</script>

The solution given here involves editing Vim's internal syntax file, which seems wrong, and it specifically looks for "text/javascript" which is no longer needed in <script> tags.

I assume the solution is some sort of syntax plugin I can keep in my .vim directory but am not familiar enough with Vim's syntax internals to figure it out.

(Note that this question and answer don't apply as I'm not using Ruby on Rails.)

Answer 1

Maybe this will help you: https://coderwall.com/p/vgk5-q/make-vim-play-nice-with-html-templates-inside-script-tags.

In case the link above is broken one day - put the following code into ~/.vim/after/syntax/html.vim:

unlet b:current_syntax
syn include @HTML $VIMRUNTIME/syntax/html.vim
syn region htmlTemplate start=+<script [^>]*type *=[^>]*text/template[^>]*>+
\                       end=+</script>+me=s-1 keepend
\                       contains=@HTML,htmlScriptTag,@htmlPreproc

Somebody should write a plugin for that! ;)