title: VueJS doesn't update the data in Browser, when changing the "app" parameter's value in JS Console
body: <p>As I already mentioned in the question, below is a seemingly valid and syntactically correct VueJs example which I am running in Localhost with Windows 7 64Bit environment (Nginx configured):</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
      &lt;head&gt;
          &lt;meta charset="UTF-8"&gt;
          &lt;script type="application/x-javascript" src="https://cdn.jsdelivr.net/npm/vue"&gt;&lt;/script&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;div id="app"&gt;
              &lt;h1&gt;{{ message }}&lt;/h1&gt;
          &lt;/div&gt;
          &lt;script type="application/x-javascript"&gt;
              var myObject = new Vue({
                  el: '#app',
                  data: {
                      message: 'Hello Vue!'
                  }
              })
          &lt;/script&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Now when I run this in Firefox Browser(version 65.0), it displays the expected text, but when I F12 open the Console and type <code>app.message = 'Test';</code> and then press Enter, it doesn't update the text in the browser, just the like the docs said it would.</p>
  
  <p>What am I missing here ?</p>