How to attach Vue object to block with svg icon?

Question

Vue.js

There is a block with an embedded svg icon (link with a picture)
I need to attach a Vue object to it, but Vue swears at the presence of tags

Answer 1

<a id="authPopupLink" rel="nofollow" itle="Мой кабинет" class="personal-link dark-color animate-load" data-param-type="auth" data-event="jqm" data-param-backurl="/auth/index.php" data-name="auth" href="/personal/">
  <i class="svg inline svg-inline-cabinet" aria-hidden="true" title="Мой кабинет">
    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="17" viewBox="0 0 16 17"> 
      <defs> 
        <svg:style> .loccls-1 { fill: #222; fill-rule: evenodd; } </svg:style>
      </defs> 
      <path class="loccls-1" d="M14,17H2a2,2,0,0,1-2-2V8A2,2,0,0,1,2,6H3V4A4,4,0,0,1,7,0H9a4,4,0,0,1,4,4V6h1a2,2,0,0,1,2,2v7A2,2,0,0,1,14,17ZM11,4A2,2,0,0,0,9,2H7A2,2,0,0,0,5,4V6h6V4Zm3,4H2v7H14V8ZM8,9a1,1,0,0,1,1,1v2a1,1,0,0,1-2,0V10A1,1,0,0,1,8,9Z"></path>
    </svg>
  </i>
  <span class="wrap">
    <span class="name">Войти</span>
  </span>
</a>

Answer 2

Drop errors. Vue works fine with svg https://jsfiddle.net/sgt54bzn/ but the svg needs to be embedded on the page, not remotely (via img or use).