Render Vue.js x-template with underscore.js template function

Question

I have a Vue.js x-template render script and would like to use Underscore.js _.template() templating engine instead of the default logic-less Handlebars syntax. As I need to add if loops and some additional JS logic, which Handlebars syntax does not provide. How can I implement such as solution?

Vue component code:

Vue.component('tmpl-heading',
  template: '#tmpl-heading',
  props: ['settings']
)

X-template script tag:

<script type="text/x-template" id="tmpl-heading">
<h1>{{ settings.text }}</h1>
</script>