title: Component rendered as comment in VueJS + JSPM
body: <p>I tried to build simple app using jspm with vue.js.</p>
  
  <p>This is my html file:</p>
  
  <pre><code>&lt;html&gt;
      &lt;head&gt;
          &lt;script src="bundle.js"&gt;&lt;/script&gt;
          &lt;!--script src="jspm_packages/npm/vue@2.1.10/dist/vue.min.js"&gt;&lt;/script--&gt;
      &lt;/head&gt;
      &lt;body&gt;
         &lt;div id="app"&gt;
            {{ message }}
          &lt;/div&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>My main.js file:</p>
  
  <pre><code>import Vue from "vue"
  
  const app = new Vue({
      el: '#app',
      data: {
          message: 'Hello Vue!'
      }
  });
  </code></pre>
  
  <p>I'm building self-executing bundle like this:</p>
  
  <pre><code>jspm bundle-sfx main.js bundle.js
  </code></pre>
  
  <p>When I open browser I can see that node <code>div#app</code> is replaced by comment node.</p>
  
  <p><a href="https://i.stack.imgur.com/ekJfG.png" rel="noreferrer"><img src="https://i.stack.imgur.com/ekJfG.png" alt="empty comment node"></a></p>
  
  <p>You can also see comment node in <code>$el</code> in <code>Vue</code> object:</p>
  
  <p><a href="https://i.stack.imgur.com/TCwto.png" rel="noreferrer"><img src="https://i.stack.imgur.com/TCwto.png" alt="comment node in vue object"></a></p>
  
  <p>When I use Vue from separate file (for example from downloaded by jspm file from <code>jspm_packages/npm/vue@2.1.10/dist/vue.min.js</code>) everything works correctly.</p>
  
  <p>You can see this issue reproduced in this fiddle (js is whole bundle):</p>
  
  <p><a href="https://jsfiddle.net/oz7c82rw/" rel="noreferrer">https://jsfiddle.net/oz7c82rw/</a></p>
  
  <p>What's wrong with my code? Why dom node is rendered as empty comment?</p>