title: VueJS - Mustache syntax showing up for a split second
body: <p>I am trying to learn vue and created the sample below purely for test purposes: </p>
  
  <pre><code>import App from '../comp/app.vue';
  import Two from '../comp/two.vue';
  
  const routes = [
      { path: '/', component: App },
      { path: '/two', component: Two }
  ]
  const router = new VueRouter({
      base: base.pathname,
      mode: "history",
      routes // short for routes: routes
  })
  
  window.app = new Vue({
      el: "#container",
      data: {
          message: "home",
          date: new Date(),
          seen: false,
          fruits: [
              { name: "apple" },
              { name: "orange" },
              { name: "banana" }
          ]
      }
  })
  </code></pre>
  
  <p>But, before inserting any values the page will display the mustache syntax for a brief moment. Almost as if VueJS isn't working. After a short while VueJS will kick in and fill in the right values for the variables.</p>
  
  <p><a href="https://i.stack.imgur.com/Uxe8V.png" rel="noreferrer"><img src="https://i.stack.imgur.com/Uxe8V.png" alt="enter image description here"></a></p>
  
  <p>Why is that happening and how can I fix this behavior?</p>